From 8c06195946da9a20ef3e6b4b05d5ac67ae453d16 Mon Sep 17 00:00:00 2001 From: Irina Muchnik Date: Thu, 6 Aug 2015 11:48:08 -0400 Subject: [PATCH] bringing back the un-dead --- dist/index.html | 2 +- ...pp.min-2467c18d.js => app.min-c87ab3f8.js} | 4 +- src/css/main.css | 10476 ++++++++++++++++ src/css/main.ie.css | 9903 +++++++++++++++ src/css/main.ie.min.css | 6 + src/css/main.min.css | 17 + src/index.html | 3 + src/js/components/TeamPage.jsx | 1 - src/js/utils/__tests__/common-test.js | 20 +- 9 files changed, 20417 insertions(+), 15 deletions(-) rename dist/js/{app.min-2467c18d.js => app.min-c87ab3f8.js} (93%) create mode 100644 src/css/main.css create mode 100644 src/css/main.ie.css create mode 100644 src/css/main.ie.min.css create mode 100644 src/css/main.min.css diff --git a/dist/index.html b/dist/index.html index 92ad3b9..cb68f30 100644 --- a/dist/index.html +++ b/dist/index.html @@ -16,7 +16,7 @@
- + diff --git a/dist/js/app.min-2467c18d.js b/dist/js/app.min-c87ab3f8.js similarity index 93% rename from dist/js/app.min-2467c18d.js rename to dist/js/app.min-c87ab3f8.js index 8e3a0da..a3a6e27 100644 --- a/dist/js/app.min-2467c18d.js +++ b/dist/js/app.min-c87ab3f8.js @@ -14,5 +14,5 @@ var t=l.canUseDOM&&window.location.href||"";if(/[?&]react_perf\b/.test(t)){var o var a=i.getAttribute(N.CHECKSUM_ATTR_NAME);i.removeAttribute(N.CHECKSUM_ATTR_NAME);var s=i.outerHTML;i.setAttribute(N.CHECKSUM_ATTR_NAME,a);var u=r(e,s),c=" (client) "+e.substring(u-20,u+20)+"\n (server) "+s.substring(u-20,u+20);"production"!==n.env.NODE_ENV?A(t.nodeType!==B,"You're trying to render a component to the document using server rendering but the checksum was invalid. This usually means you rendered a different component type or props on the client from the one on the server, or your render() methods are impure. React cannot handle this case due to cross-browser quirks by rendering at the document root. You should look for environment dependent code in your components and ensure the props are the same client and server side:\n%s",c):A(t.nodeType!==B),"production"!==n.env.NODE_ENV&&("production"!==n.env.NODE_ENV?j(!1,"React attempted to reuse markup in a container but the checksum was invalid. This generally means that you are using server rendering and the markup generated on the server was not what the client was expecting. React injected new markup to compensate which works but you have lost many of the benefits of server rendering. Instead, figure out why the markup being generated is different on the client or server:\n%s",c):null)}"production"!==n.env.NODE_ENV?A(t.nodeType!==B,"You're trying to render a component to the document but you didn't use server rendering. We can't do this without using server rendering due to cross-browser quirks. See React.renderToString() for server rendering."):A(t.nodeType!==B),k(t,e)},getReactRootID:o,getID:i,setID:s,getNode:u,getNodeFromInstance:c,purgeID:p};w.measureMethods(z,"ReactMount",{_renderNewRootComponent:"_renderNewRootComponent",_mountImageIntoNode:"_mountImageIntoNode"}),t.exports=z}).call(this,e("_process"))},{"./DOMProperty":70,"./ReactBrowserEventEmitter":92,"./ReactCurrentOwner":104,"./ReactElement":122,"./ReactElementValidator":123,"./ReactEmptyComponent":124,"./ReactInstanceHandles":131,"./ReactInstanceMap":132,"./ReactMarkupChecksum":135,"./ReactPerf":141,"./ReactReconciler":148,"./ReactUpdateQueue":158,"./ReactUpdates":159,"./containsNode":183,"./emptyObject":190,"./getReactRootElementInContainer":204,"./instantiateReactComponent":209,"./invariant":210,"./setInnerHTML":224,"./shouldUpdateReactComponent":227,"./warning":231,_process:4}],137:[function(e,t,n){"use strict";function r(e,t,n){h.push({parentID:e,parentNode:null,type:l.INSERT_MARKUP,markupIndex:m.push(t)-1,textContent:null,fromIndex:null,toIndex:n})}function o(e,t,n){h.push({parentID:e,parentNode:null,type:l.MOVE_EXISTING,markupIndex:null,textContent:null,fromIndex:t,toIndex:n})}function i(e,t){h.push({parentID:e,parentNode:null,type:l.REMOVE_NODE,markupIndex:null,textContent:null,fromIndex:t,toIndex:null})}function a(e,t){h.push({parentID:e,parentNode:null,type:l.TEXT_CONTENT,markupIndex:null,textContent:t,fromIndex:null,toIndex:null})}function s(){h.length&&(c.processChildrenUpdates(h,m),u())}function u(){h.length=0,m.length=0}var c=e("./ReactComponentEnvironment"),l=e("./ReactMultiChildUpdateTypes"),p=e("./ReactReconciler"),f=e("./ReactChildReconciler"),d=0,h=[],m=[],v={Mixin:{mountChildren:function(e,t,n){var r=f.instantiateChildren(e,t,n);this._renderedChildren=r;var o=[],i=0;for(var a in r)if(r.hasOwnProperty(a)){var s=r[a],u=this._rootNodeID+a,c=p.mountComponent(s,u,t,n);s._mountIndex=i,o.push(c),i++}return o},updateTextContent:function(e){d++;var t=!0;try{var n=this._renderedChildren;f.unmountChildren(n);for(var r in n)n.hasOwnProperty(r)&&this._unmountChildByName(n[r],r);this.setTextContent(e),t=!1}finally{d--,d||(t?u():s())}},updateChildren:function(e,t,n){d++;var r=!0;try{this._updateChildren(e,t,n),r=!1}finally{d--,d||(r?u():s())}},_updateChildren:function(e,t,n){var r=this._renderedChildren,o=f.updateChildren(r,e,t,n);if(this._renderedChildren=o,o||r){var i,a=0,s=0;for(i in o)if(o.hasOwnProperty(i)){var u=r&&r[i],c=o[i];u===c?(this.moveChild(u,s,a),a=Math.max(u._mountIndex,a),u._mountIndex=s):(u&&(a=Math.max(u._mountIndex,a),this._unmountChildByName(u,i)),this._mountChildByNameAtIndex(c,i,s,t,n)),s++}for(i in r)!r.hasOwnProperty(i)||o&&o.hasOwnProperty(i)||this._unmountChildByName(r[i],i)}},unmountChildren:function(){var e=this._renderedChildren;f.unmountChildren(e),this._renderedChildren=null},moveChild:function(e,t,n){e._mountIndex>",C=s(),x=f(),N={array:o("array"),bool:o("boolean"),func:o("function"),number:o("number"),object:o("object"),string:o("string"),any:i(),arrayOf:a,element:C,instanceOf:u,node:x,objectOf:l,oneOf:c,oneOfType:p,shape:d};t.exports=N},{"./ReactElement":122,"./ReactFragment":128,"./ReactPropTypeLocationNames":143,"./emptyFunction":189}],146:[function(e,t,n){"use strict";function r(){this.listenersToPut=[]}var o=e("./PooledClass"),i=e("./ReactBrowserEventEmitter"),a=e("./Object.assign");a(r.prototype,{enqueuePutListener:function(e,t,n){this.listenersToPut.push({rootNodeID:e,propKey:t,propValue:n})},putListeners:function(){for(var e=0;er;r++){var o=E[r],i=o._pendingCallbacks;if(o._pendingCallbacks=null,h.performUpdateIfNecessary(o,e.reconcileTransaction),i)for(var s=0;s, , and ) reliably and efficiently. To fix this, have a single top-level component that never unmounts render these elements.",this.constructor.displayName):a(!1)},render:function(){return t(this.props)}});return r}var o=e("./ReactClass"),i=e("./ReactElement"),a=e("./invariant");t.exports=r}).call(this,e("_process"))},{"./ReactClass":97,"./ReactElement":122,"./invariant":210,_process:4}],186:[function(e,t,n){(function(n){function r(e){var t=e.match(l);return t&&t[1].toLowerCase()}function o(e,t){var o=c;"production"!==n.env.NODE_ENV?u(!!c,"createNodesFromMarkup dummy not initialized"):u(!!c);var i=r(e),l=i&&s(i);if(l){o.innerHTML=l[1]+e+l[2];for(var p=l[0];p--;)o=o.lastChild}else o.innerHTML=e;var f=o.getElementsByTagName("script");f.length&&("production"!==n.env.NODE_ENV?u(t,"createNodesFromMarkup(...): Unexpected + notes: + - "First add the .no-js class to the HTML element." + - "Then add the script to your HEAD which removes the .no-js class when + JS is available." + - name: Utility class + codenotes: + - .u-js-only; + notes: + - "Hide stuff when JavaScript isn't available. Depends on having a small + script in the HEAD of your HTML document that removes a .no-js class." + tags: + - cf-core +*/ +.no-js .u-js-only { + display: none !important; +} + +/* topdoc + name: Clearfix + family: cf-core + patterns: + - name: Utility class + markup: | +
+
+
+ codenotes: + - .u-clearfix; + notes: + - "Use this class to clear floats. For example, without .u-clearfix the + black box would spill into the markup section." + - "More information: http://css-tricks.com/snippets/css/clear-fix/" + tags: + - cf-core +*/ +.u-clearfix:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .u-clearfix { + zoom: 1; +} + +/* topdoc + name: Visually hidden + family: cf-core + patterns: + - name: Utility class + markup: | +

+ + + Share on Twitter + +

+ codenotes: + - .u-visually-hidden; + notes: + - "Use this class to hide something from view while keeping it + accessible to screen readers." + tags: + - cf-core +*/ +.u-visually-hidden { + position: absolute; + overflow: hidden; + clip: rect(0 0 0 0); + height: 1px; + width: 1px; + margin: -1px; + padding: 0; + border: 0; +} + +/* topdoc + name: Inline block + family: cf-core + patterns: + - name: Utility class + codenotes: + - .u-inline-block; + notes: + - "Also adds a .lt-ie8 class to hack inline-block for IE 7 and below." + tags: + - cf-core +*/ +.u-inline-block { + display: inline-block; +} + +.lt-ie8 .u-inline-block { + display: inline; +} + +/* topdoc + name: Floating right + family: cf-core + patterns: + - name: Utility class + codenotes: + - .u-right; + notes: + - "IE7 float: right drop bug fixes:" + - "1. If the float: right follows an element in the html structure that + should be to its left (and not above it), then that preceding + element(s) must be float: left. + http://stackoverflow.com/questions/10981767/clean-css-fix-of-ie7s-float-right-drop-bug#answer-11437688" + - "2. Simply change the markup order so that the element floating right + comes before the element to its left." + tags: + - cf-core +*/ +.u-right { + float: right; +} + +/* topdoc + name: Break word + family: cf-core + patterns: + - name: Utility class + markup: | +
+ This link should break: +
+ + something@something.com + +
+
+ This link should not: +
+ + something@something.com + +
+ codenotes: + - .u-break-word + notes: + - "Use this on elements where you need the words to break when confined + to small containers." + - "This only works in IE8 when the element with the .u-break-word class + has layout. See + for more information." + tags: + - cf-core +*/ +.u-break-word { + word-break: break-all; +} + +/* topdoc + name: Align with button + family: cf-core + patterns: + - name: Utility class + codenotes: + - ".u-align-with-btn(@font-size: @base-font-size-px);" + notes: + - "Adds top padding (among other things) to help alignment with buttons." + - "If you pass no arguments then the padding will be calculated using + @base-font-size-px." + - "Pass one argument to use a custom font size to calculate the top + padding." + tags: + - cf-core +*/ +/* topdoc + name: Flexible proportional containers + family: cf-core + notes: + - "Utilizes intrinsic ratios to create a flexible container that retains its + aspect ratio. When image tags scale they retain their aspect ratio, but if + you need a flexible video you will need to use this mixin." + - "You can read more about intrinsic rations here: + http://alistapart.com/article/creating-intrinsic-ratios-for-video" + patterns: + - name: Default example + markup: | +
+ +
+ notes: + - "Defaults to a 16:19 ratio." + - "Original mixin credit: https://gist.github.com/craigmdennis/6655047" + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container + .u-flexible-container_inner + - name: Background image examples + markup: | +
+
+
+
+ codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container + notes: + - "If you're not using the video or object elements and all you need is + a proportionally cropped or scaling background image with a fluid + container then you can leave out u-flexible-container_inner." + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + - name: 4-3 modifier + markup: | +
+ +
+ codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container.u-flexible-container__4-3 + .u-flexible-container_inner + notes: + - "Create your own aspect ratios by using this modifier as an example." + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + tags: + - cf-core +*/ +.u-flexible-container { + position: relative; + padding-bottom: 56.25%; + height: 0; +} + +.u-flexible-container_inner { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +.u-flexible-container__4-3 { + position: relative; + padding-bottom: 75%; + height: 0; +} + +/* topdoc + name: Link mixins + family: cf-core + patterns: + - codenotes: + - .u-link__colors(); + notes: + - "Pass this mixin no arguments to color your link states with the + following defaults: :link (default state) pacific, :hover pacific-50, + :focus: pacific, :visited teal, :active navy." + - codenotes: + - .u-link__colors(@c); + notes: + - "Pass this mixin one color to be used on all of the following + states of your link; :link (default state), :visited, :hover, :focus, + :active." + - codenotes: + - .u-link__colors(@c, @h); + notes: + - "Pass this mixin two colors to use the first color for the :link, + :visited, and :active states, and the second color for the :hover and + :focus states." + - codenotes: + - .u-link__colors(@c, @v, @h, @f, @a); + notes: + - "Pass this mixin five colors in 'love/hate' mnemonic order to color + :link, :visited, :hover, :focus, and :active states respectively." + - "Even though this mixin is basically the same as + .u-link__colors-base(@c, @v, @h, @f, @a); we encourage you to use + .u-link__colors(@c, @v, @h, @f, @a) to promote consistency." + - codenotes: + - .u-link__colors(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba); + notes: + - "Allows you to color text and the borders separately." + - "The first five colors in 'love/hate' mnemonic order will color text + for the :link, :visited, :hover, :focus, and :active states + respectively. The last five colors in 'love/hate' mnemonic order will + color the borders for the :link, :visited, :hover, :focus, and :active + states respectively." + - "Even though this mixin is basically the same as + .u-link__colors-base(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba); we + encourage you to use .u-link__colors(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba) + to promote consistency." + - codenotes: + - .u-link__colors-base(@c, @v, @h, @f, @a); + notes: + - "This is the base mixin that all .u-link__colors() mixins use. Please + refrain from using this mixin directly in order to promote a + consistent use of mixin names for coloring links throughout this + project. Remember that if you need to set colors for all states of a + link you should use .u-link__colors(@c, @v, @h, @f, @a)." + - codenotes: + - .u-link__border(); + notes: + - "Forces the default bottom border on the :link and :hover states." + - codenotes: + - .u-link__no-border(); + notes: + - "Turn off the default bottom border on the :link and :hover states." + - codenotes: + - .u-link__hover-border(); + notes: + - "Turn off the default bottom border on the :link state and force a + bottom border on the :hover state." + - codenotes: + - .u-link-child__hover(); + notes: + - "When a link has child elements you may want only certain children to + change color when the parent link is hovered. + Pass no arguments to this mixin to color the child element pacific + when the parent link is hovered." + - codenotes: + - .u-link-child__hover(@c); + notes: + - "Pass this mixin one color to color the child element when the parent + link is hovered." + tags: + - cf-core +*/ +/* topdoc + name: Margin utilities + family: cf-core + patterns: + - name: Utility classes + codenotes: + - .u-m

<#>; + notes: + - "Replace

with the first letter of the position ('t' for top or 'b' + for bottom) and <#> with the pixel value of the margin you want." + - "Available values: 0, 5, 10, 15, 20, 30, 45, 60." + tags: + - cf-core +*/ +.u-mt0 { + margin-top: 0 !important; +} + +.u-mb0 { + margin-bottom: 0 !important; +} + +.u-mt5 { + margin-top: 5px !important; +} + +.u-mb5 { + margin-bottom: 5px !important; +} + +.u-mt10 { + margin-top: 10px !important; +} + +.u-mb10 { + margin-bottom: 10px !important; +} + +.u-mt15 { + margin-top: 15px !important; +} + +.u-mb15 { + margin-bottom: 15px !important; +} + +.u-mt20 { + margin-top: 20px !important; +} + +.u-mb20 { + margin-bottom: 20px !important; +} + +.u-mt30 { + margin-top: 30px !important; +} + +.u-mb30 { + margin-bottom: 30px !important; +} + +.u-mt45 { + margin-top: 45px !important; +} + +.u-mb45 { + margin-bottom: 45px !important; +} + +.u-mt60 { + margin-top: 60px !important; +} + +.u-mb60 { + margin-bottom: 60px !important; +} + +/* topdoc + name: Width utilities + family: cf-core + patterns: + - name: Percent-based + markup: | +

+ .u-w100pct +
+
+ .u-w90pct +
+
+ .u-w80pct +
+
+ .u-w70pct +
+
+ .u-w60pct +
+
+ .u-w50pct +
+
+ .u-w40pct +
+
+ .u-w30pct +
+
+ .u-w20pct +
+
+ .u-w10pct +
+
+ .u-w75pct +
+
+ .u-w25pct +
+
+ .u-w66pct +
+
+ .u-w33pct +
+ notes: + - "Inline styles are for demonstration purposes only, please don't use + them." + tags: + - cf-core +*/ +.u-w100pct { + width: 100%; +} + +.u-w90pct { + width: 90%; +} + +.u-w80pct { + width: 80%; +} + +.u-w70pct { + width: 70%; +} + +.u-w60pct { + width: 60%; +} + +.u-w50pct { + width: 50%; +} + +.u-w40pct { + width: 40%; +} + +.u-w30pct { + width: 30%; +} + +.u-w20pct { + width: 20%; +} + +.u-w10pct { + width: 10%; +} + +.u-w75pct { + width: 75%; +} + +.u-w25pct { + width: 25%; +} + +.u-w66pct { + width: 66.66666667%; +} + +.u-w33pct { + width: 33.33333333%; +} + +/* topdoc + name: Width-specific display + family: cf-core + patterns: + - name: Show on mobile + markup: | +
+

The the text in the box below is visible only at widths less than 600px

+
+

Visible on mobile

+
+
+ codenotes: + - ".u-show-on-mobile" + - "Uses 'display:block' to toggle display. Would need to be extended + for inline use cases." + notes: + - "Displays an element only at mobile widths." + - name: Hide on mobile + markup: | +
+

The text in the box below is hidden at widths less than 600px

+
+

Hidden on mobile

+
+
+ codenotes: + - ".u-hide-on-mobile" + notes: + - "Hides an element at mobile widths" + tags: + - cf-core +*/ +@media only all and (max-width: 37.4375em) { + .u-hide-on-mobile { + display: none; + } +} + +.u-show-on-mobile { + display: none; +} + +@media only all and (max-width: 37.4375em) { + .u-show-on-mobile { + display: block; + } +} + +/* topdoc + name: Small text utility + family: cf-core + patterns: + - name: .u-small-text (utility class) + markup: | + Lorem ipsum
+ dolor sit amet + codenotes: + - ".u-small-text" + notes: + - "14px text." + - "The utility class should only be used when the default text size is + 16px. For example you wouldn't want to use the class inside of an + `h1` because the `font-size` in the `h1` will make `.u-small-text` + bigger than it should be. See the docs for the `.u-small-text()` + mixin." + - name: .u-small-text() (Less mixin) + codenotes: + - ".u-small-text(@context)" + - | + // Mixin usage: + .example { + font-size: unit(20px / @base-font-size-px, em); + small { + .u-small-text(20px); + } + } + // Compiles to: + .example { + font-size: 1.25em; + } + .example small { + font-size: 0.7em; + } + notes: + - "This mixin enables you to easily create consistent small text by + passing the context `font-size`." + tags: + - cf-core +*/ +.u-small-text { + font-size: 0.875em; +} + +small { + font-size: 0.875em; +} + +/* topdoc + name: EOF + eof: true +*/ +/* ========================================================================== + Capital Framework + Base styles + ========================================================================== */ +/* + * Source: http://fast.fonts.net/cssapi/44e8c964-4684-44c6-a6e3-3f3da8787b50.css + * This file has been edited to use absolute URLS so we can concatenate it with + * all of our other styles. + */ +@font-face { + font-family: "AvenirNextLTW01-Regular"; + src: url("//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Regular"; + src: url("//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/1e9892c0-6927-4412-9874-1b82801ba47a.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/46cf1067-688d-4aab-b0f7-bd942af6efd8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/52a192b1-bea5-4b48-879f-107f009b666f.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#52a192b1-bea5-4b48-879f-107f009b666f") format("svg"); + font-style: normal; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Italic"; + src: url("//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: italic; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Italic"; + src: url("//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/18839597-afa8-4f0b-9abb-4a30262d0da8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585") format("svg"); + font-style: italic; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Medium"; + src: url("//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: 500; +} + +@font-face { + font-family: "AvenirNextLTW01-Medium"; + src: url("//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/f26faddb-86cc-4477-a253-1e1287684336.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/63a74598-733c-4d0c-bd91-b01bffcd6e69.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/a89d6ad1-a04f-4a8f-b140-e55478dbea80.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#a89d6ad1-a04f-4a8f-b140-e55478dbea80") format("svg"); + font-style: normal; + font-weight: 500; +} + +@font-face { + font-family: "AvenirNextLTW01-Demi"; + src: url("//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: 700; +} + +@font-face { + font-family: "AvenirNextLTW01-Demi"; + src: url("//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/a0f4c2f9-8a42-4786-ad00-fce42b57b148.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/99affa9a-a5e9-4559-bd07-20cf0071852d.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#99affa9a-a5e9-4559-bd07-20cf0071852d") format("svg"); + font-style: normal; + font-weight: 700; +} + +/* topdoc + name: Webfonts + family: cf-core + patterns: + - name: Licensed webfonts + notes: + - "Avenir Next is included via the licensed-fonts.css file. + This file contains absolute links to our paid font service. + Fonts included this way will only work on CFPB-registered domains." + - "Note that when using Avenir Regular we automatically fix faux italic + and bold issues by overriding i, em, b, and strong tags to use the + appropriate fonts." + - name: Webfont mixins + codenotes: + - ".webfont-regular()" + - ".webfont-italic()" + - ".webfont-medium()" + - ".webfont-demi()" + notes: + - "Use these mixins to easily add the Avenir Next font family to your + elements." + - "To avoid faux bold and italics in Avenir Next, you must use the font + family name for that particular style. So when defining an italic or + bold style in Avenir Next you need to use the Avenir Next Italic font + family. Use the mixins when setting bold or italic text as they also + set the appropriate font-weight and font-style." + - "These mixins also add the appropriate .lt-ie9 overrides. + .lt-ie9 overrides are necessary to override font-style and font-weight + each time the webfont is used. These overrides are built into the webfont + mixins so you get them automatically. Note that this requires you to + use conditional classes on the element: + https://github.com/h5bp/html5-boilerplate/blob/v4.3.0/doc/html.md#conditional-html-classes." + tags: + - cf-core +*/ +/* topdoc + name: Type hierarchy + family: cf-core + patterns: + - name: Default body type + markup: | +

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

+ - name: Heading level 1 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h2. + - name: Heading level 2 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h3. + - name: Heading level 3 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h4. + - name: Heading level 4 + markup: | +

Example heading element

+

A non-heading element

+ - name: Heading level 5 + markup: | +
Example heading element
+

A non-heading element

+ - name: Heading level 6 + markup: | +
Example heading element
+

A non-heading element

+ - name: Super header + markup: | +

Example super heading

+

Example super heading

+ tags: + - cf-core +*/ +body { + color: #101820; + font-family: Georgia, "Times New Roman", serif; + font-size: 100%; + line-height: 1.375; +} + +h1, +.h1, +h2, +.h2, +h3, +.h3 { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +h1 em, +.h1 em, +h2 em, +.h2 em, +h3 em, +.h3 em, +h1 i, +.h1 i, +h2 i, +.h2 i, +h3 i, +.h3 i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 h1 em, +.lt-ie9 .h1 em, +.lt-ie9 h2 em, +.lt-ie9 .h2 em, +.lt-ie9 h3 em, +.lt-ie9 .h3 em, +.lt-ie9 h1 i, +.lt-ie9 .h1 i, +.lt-ie9 h2 i, +.lt-ie9 .h2 i, +.lt-ie9 h3 i, +.lt-ie9 .h3 i { + font-style: normal !important; +} + +h1 strong, +.h1 strong, +h2 strong, +.h2 strong, +h3 strong, +.h3 strong, +h1 b, +.h1 b, +h2 b, +.h2 b, +h3 b, +.h3 b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 h1 strong, +.lt-ie9 .h1 strong, +.lt-ie9 h2 strong, +.lt-ie9 .h2 strong, +.lt-ie9 h3 strong, +.lt-ie9 .h3 strong, +.lt-ie9 h1 b, +.lt-ie9 .h1 b, +.lt-ie9 h2 b, +.lt-ie9 .h2 b, +.lt-ie9 h3 b, +.lt-ie9 .h3 b { + font-weight: normal !important; +} + +h1, +.h1 { + margin-top: 0; + margin-bottom: 0.47058824em; + font-size: 2.125em; + line-height: 1.29411765; +} + +@media only all and (max-width: 37.4375em) { + h1, + .h1 { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + margin-top: 0; + margin-bottom: 0.73076923em; + font-size: 1.625em; + line-height: 1.26923077; + } + + h1 em, + .h1 em, + h1 i, + .h1 i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; + } + + .lt-ie9 h1 em, + .lt-ie9 .h1 em, + .lt-ie9 h1 i, + .lt-ie9 .h1 i { + font-style: normal !important; + } + + h1 strong, + .h1 strong, + h1 b, + .h1 b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + } + + .lt-ie9 h1 strong, + .lt-ie9 .h1 strong, + .lt-ie9 h1 b, + .lt-ie9 .h1 b { + font-weight: normal !important; + } +} + +@media only all and (max-width: 37.4375em) and only all and (max-width: + +37.4375em + +) { + h1, + .h1 { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + margin-top: 0; + margin-bottom: 0.95454545em; + font-size: 1.375em; + line-height: 1.27272727; + } + + h1 em, + .h1 em, + h1 i, + .h1 i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; + } + + .lt-ie9 h1 em, + .lt-ie9 .h1 em, + .lt-ie9 h1 i, + .lt-ie9 .h1 i { + font-style: normal !important; + } + + h1 strong, + .h1 strong, + h1 b, + .h1 b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + } + + .lt-ie9 h1 strong, + .lt-ie9 .h1 strong, + .lt-ie9 h1 b, + .lt-ie9 .h1 b { + font-weight: normal !important; + } +} + +@media only all and (max-width: 37.4375em) and only all and (max-width: + +37.4375em + +) and only all and + +(max-width: + +37.4375em + +) { + h1, + .h1 { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; + } + + .lt-ie9 h1, + .lt-ie9 .h1 { + font-weight: normal !important; + } +} + +h2, +.h2 { + margin-top: 0; + margin-bottom: 0.73076923em; + font-size: 1.625em; + line-height: 1.26923077; +} + +@media only all and (max-width: 37.4375em) { + h2, + .h2 { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + margin-top: 0; + margin-bottom: 0.95454545em; + font-size: 1.375em; + line-height: 1.27272727; + } + + h2 em, + .h2 em, + h2 i, + .h2 i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; + } + + .lt-ie9 h2 em, + .lt-ie9 .h2 em, + .lt-ie9 h2 i, + .lt-ie9 .h2 i { + font-style: normal !important; + } + + h2 strong, + .h2 strong, + h2 b, + .h2 b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + } + + .lt-ie9 h2 strong, + .lt-ie9 .h2 strong, + .lt-ie9 h2 b, + .lt-ie9 .h2 b { + font-weight: normal !important; + } +} + +@media only all and (max-width: 37.4375em) and only all and (max-width: + +37.4375em + +) { + h2, + .h2 { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; + } + + .lt-ie9 h2, + .lt-ie9 .h2 { + font-weight: normal !important; + } +} + +h3, +.h3 { + margin-top: 0; + margin-bottom: 0.95454545em; + font-size: 1.375em; + line-height: 1.27272727; +} + +@media only all and (max-width: 37.4375em) { + h3, + .h3 { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; + } + + .lt-ie9 h3, + .lt-ie9 .h3 { + font-weight: normal !important; + } +} + +h4, +.h4 { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; +} + +.lt-ie9 h4, +.lt-ie9 .h4 { + font-weight: normal !important; +} + +h5, +h6, +.h5, +.h6 { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; +} + +.lt-ie9 h5, +.lt-ie9 h6, +.lt-ie9 .h5, +.lt-ie9 .h6 { + font-weight: normal !important; +} + +h5, +.h5 { + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; +} + +h6, +.h6 { + margin-top: 0; + margin-bottom: 0.41666667em; + font-size: 0.75em; + line-height: 1.83333333; +} + +.superheader { + margin-bottom: 0.1875em; + font-size: 3em; + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + line-height: 1.25; +} + +.lt-ie9 .superheader { + font-weight: normal !important; +} + +/* topdoc + name: Margins + family: cf-core + patterns: + - name: Consistent vertical margins + notes: + - "Assumes that the font size of each of these items remains the default." + markup: | +

Paragraph margin example

+

Paragraph margin example

+ tags: + - cf-core +*/ +p, +ul, +ol, +dl, +table, +figure { + margin-top: 0; + margin-bottom: 1.25em; +} + +/* topdoc + name: Default link + notes: + - "Note that the .visited, .hover, .focus, .active classes are for demonstration purposes only and should not + be used in production." + family: cf-core + patterns: + - name: Default state + markup: | + Default link style + - name: Visited state + markup: | + Visited link style + - name: Hovered state + markup: | + Hovered link style + - name: Focused state + markup: | + Focused link style + - name: Active state + markup: | + Active link style + tags: + - cf-core +*/ +a { + border-width: 0; + border-style: dotted; + border-color: #0072ce; + color: #0072ce; + text-decoration: none; +} + +a:visited, +a.visited { + border-color: #005e5d; + color: #005e5d; +} + +a:hover, +a.hover { + border-style: solid; + border-color: #7fb8e6; + color: #7fb8e6; +} + +a:focus, +a.focus { + border-style: solid; + outline: thin dotted; +} + +a:active, +a.active { + border-style: solid; + border-color: #002d72; + color: #002d72; +} + +/* topdoc + name: Underlined links + family: cf-core + patterns: + - name: States + notes: + - "Note that the .visited, .hover, .focus, .active classes are for demonstration purposes only and should not + be used in production." + - "The underline style properties are mostly set above in the a tag. + To enable the underline simply set a bottom-border-width as done here." + markup: | +

+ Default, + Visited, + Hovered, + Focused, + Active +

+ - name: Underline conditions + notes: + - "We're restricting link borders to links within p, li, and dd so that + we don't have to override them every time we want a plain link." + markup: | +

+ A child of a paragraph +

+ +
+
+ Definition list term +
+
+ A child of a definition list description +
+
+ - name: Exceptions for underlined links + notes: + - "Inline text links inside of a nav element are not underlined." + markup: | + + tags: + - cf-core +*/ +p a, +li a, +dd a { + border-bottom-width: 1px; +} + +nav a { + border-bottom-width: 0; +} + +/* topdoc + name: Lists + family: cf-core + patterns: + - name: Unordered list + markup: | +
    +
  • List item
    • +
  • List item
    • +
  • List item
    • +
+ tags: + - cf-core +*/ +ul { + list-style: square; +} + +/* topdoc + name: Tables + family: cf-core + patterns: + - name: Standard table + markup: | + + + + + + + + + + + + + + + + + + + + + + + + + +
Column 1 headerColumn 2 headerColumn 3 header
Row 1 headerRow 1, column 2Row 1, column 3
Row 2 headerRow 2, column 2Row 2, column 3
Row 3 headerRow 3, column 2Row 3, column 3
+ - name: Compact table + markup: | + + + + + + + + + + + + + + + + + + + + + + + + + +
Column 1 headerColumn 2 headerColumn 3 header
Row 1 headerRow 1, column 2Row 1, column 3
Row 2 headerRow 2, column 2Row 2, column 3
Row 3 headerRow 3, column 2Row 3, column 3
+ notes: + - Reduces cell padding to 10px. + tags: + - cf-core +*/ +table { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +table em, +table i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 table em, +.lt-ie9 table i { + font-style: normal !important; +} + +table strong, +table b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 table strong, +.lt-ie9 table b { + font-weight: normal !important; +} + +th, +td { + padding: 0.75em 0.9375em; + background: #f8f8f8; +} + +thead th, +thead td { + color: #ffffff; + background: #43484e; +} + +tbody > tr:nth-child(odd) > th, +tbody > tr:nth-child(odd) > td { + background: #f1f2f2; +} + +.compact-table th, +.compact-table td { + padding: 0.4375em 0.625em; +} + +th { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + text-align: left; +} + +.lt-ie9 th { + font-weight: normal !important; +} + +/* topdoc + name: Block quote + family: cf-core + patterns: + - name: Default block quote + markup: | +
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa + similique fugit hic eligendi praesentium officiis illum optio iusto + commodi eum tempore nisi ad in perferendis enim quo dolores. + Reprehenderit similique earum quibusdam possimus vitae esse + nesciunt mollitia sed beatae aliquid dolores iure a impedit quam + minus eum modi illum ducimus eligendi eveniet labore non sequi + voluptate et totam praesentium animi itaque asperiores dolorum + sunt laudantium repellat nam commodi. Perspiciatis natus aliquam + veniam officiis ducimus voluptatum ut necessitatibus non! +
+ notes: + - "Use a block quote to quote from an external work. See .pull-quote if + you need to highlight an excerpt from the current work." + - "It is best practice to document the URL of a quoted work using the + cite attribute." + tags: + - cf-core +*/ +blockquote { + margin: 1.25em; +} + +@media only all and (min-width: 37.5em) { + blockquote { + margin: 1.75em 2.5em; + } +} + +/* topdoc + name: Form labels + family: cf-core + notes: + - "Visit https://github.com/cfpb/cf-forms for advanced form label patterns." + patterns: + - name: Default label + markup: | + + - name: Label wrapping a radio or checkbox + markup: | + + + tags: + - cf-core +*/ +label { + display: block; + margin-bottom: 0.3125em; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +label em, +label i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 label em, +.lt-ie9 label i { + font-style: normal !important; +} + +label strong, +label b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 label strong, +.lt-ie9 label b { + font-weight: normal !important; +} + +label input[type="radio"], +label input[type="checkbox"] { + margin-right: 0.375em; +} + +/* topdoc + name: Form elements + family: cf-core + notes: + - "The .focus class is only included for documentation demos and should + not be used in production." + - "Visit https://github.com/cfpb/cf-forms for advanced form field patterns." + patterns: + - name: type="text" + markup: | + + +

+ + - name: type="search" + markup: | + + +

+ + - name: type="email" + markup: | + + +

+ + - name: type="url" + markup: | + + +

+ + - name: type="tel" + markup: | + + +

+ + - name: type="number" + markup: | + + +

+ + - name: textarea + markup: | + + + - name: multi-select + markup: | + + + tags: + - cf-core +*/ +input[type="text"], +input[type="search"], +input[type="email"], +input[type="url"], +input[type="tel"], +input[type="number"], +textarea, +select[multiple] { + display: inline-block; + margin: 0; + padding: 0.375em; + font-family: Arial, sans-serif; + font-size: 1em; + background: #ffffff; + border: 1px solid #75787b; + border-radius: 0; + vertical-align: top; + -webkit-appearance: none; + -webkit-user-modify: read-write-plaintext-only; +} + +::-webkit-search-decoration { + -webkit-appearance: none; +} + +input[type="text"]:focus, +input[type="text"].focus, +input[type="search"]:focus, +input[type="search"].focus, +input[type="email"]:focus, +input[type="email"].focus, +input[type="url"]:focus, +input[type="url"].focus, +input[type="tel"]:focus, +input[type="tel"].focus, +input[type="number"]:focus, +input[type="number"].focus, +textarea:focus, +textarea.focus, +select[multiple]:focus, +select[multiple].focus { + border: 1px solid #0072ce; + outline: 1px solid #0072ce; + outline-offset: 0; + box-shadow: none; +} + +::-webkit-input-placeholder { + color: #75787b; +} + +::-moz-placeholder { + color: #75787b; +} + +:-ms-input-placeholder { + color: #75787b; +} + +/* topdoc + name: Images + family: cf-core + patterns: + - name: max-width + markup: | + + notes: + - "Gives all images a default max-width of 100% of their container." + tags: + - cf-core +*/ +img { + max-width: 100%; +} + +/* topdoc + name: Figure + family: cf-core + patterns: + - name: figure + markup: | +
+ +
+ - name: figure.figure__bordered + markup: | +
+ +
+ tags: + - cf-core +*/ +figure { + margin-left: 0; + margin-right: 0; +} + +figure img { + vertical-align: middle; +} + +.figure__bordered img { + border: 1px solid #babbbd; +} + +/* topdoc + name: EOF + eof: true +*/ +/* ========================================================================== + Capital Framework + Color variables + ========================================================================== */ +/* ========================================================================== + Capital Framework theme overrides + ========================================================================== */ +/* cf-core + ========================================================================== */ +/* cf-buttons + ========================================================================== */ +/* cf-expandables + ========================================================================== */ +/* cf-forms + ========================================================================== */ +/* cf-grid + ========================================================================== */ +/* cf-icons + ========================================================================== */ +/* cf-layout + ========================================================================== */ +/* cf-pagination + ========================================================================== */ +/* cf-typography + ========================================================================== */ +.intro-message { + padding: 1em; + background: #f1f2f2; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; +} + +.lt-ie9 .intro-message { + font-weight: normal !important; +} + +.feature-header { + display: inline-block; + padding-bottom: 0.625em; + margin-bottom: 1.875em; + border-bottom: 4px solid #2cb34a; +} + +.feature-header_name { + display: inline-block; + margin: 0; + line-height: 1; +} + +.feature-header_docs { + display: inline-block; + vertical-align: top; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +.feature-header_docs em, +.feature-header_docs i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .feature-header_docs em, +.lt-ie9 .feature-header_docs i { + font-style: normal !important; +} + +.feature-header_docs strong, +.feature-header_docs b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .feature-header_docs strong, +.lt-ie9 .feature-header_docs b { + font-weight: normal !important; +} + +.feature-header_name + .feature-header_docs { + margin-left: 1em; +} + +.color-demo { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; + height: 30px; +} + +.lt-ie8 .color-demo { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.color-demo__btn-bg { + background-color: #0072ce; +} + +.color-demo__btn-secondary-bg { + background-color: #75787b; +} + +.color-demo__btn-disabled-bg { + background-color: #e3e4e5; +} + +.sample-grid { + display: block; + position: relative; + margin-left: -15px; + margin-right: -15px; +} + +.sample-grid_col:before { + content: ""; + display: block; + width: 100%; + height: 1em; + background: #0072ce; +} + +.sample-grid_col-1 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 8.33333333%; +} + +.lt-ie8 .sample-grid_col-1 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-3 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 25%; +} + +.lt-ie8 .sample-grid_col-3 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-4 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; +} + +.lt-ie8 .sample-grid_col-4 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-6 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 50%; +} + +.lt-ie8 .sample-grid_col-6 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.typography-demo_item:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .typography-demo_item { + zoom: 1; +} + +.typography-demo_item-header { + float: left; + width: 12.5em; + margin-right: 30px; + text-align: right; +} + +.typography-demo .spec { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + color: #75787B; + font-size: 0.875em; +} + +.typography-demo .spec em, +.typography-demo .spec i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .typography-demo .spec em, +.lt-ie9 .typography-demo .spec i { + font-style: normal !important; +} + +.typography-demo .spec strong, +.typography-demo .spec b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .typography-demo .spec strong, +.lt-ie9 .typography-demo .spec b { + font-weight: normal !important; +} diff --git a/src/css/main.ie.css b/src/css/main.ie.css new file mode 100644 index 0000000..7579ea1 --- /dev/null +++ b/src/css/main.ie.css @@ -0,0 +1,9903 @@ +@import url(//fast.fonts.net/t/1.css?apiType=css&projectid=44e8c964-4684-44c6-a6e3-3f3da8787b50); + +/* ========================================================================== + zzzzz + ========================================================================== */ + +/*! normalize.css v3.0.2 | MIT License | git.io/normalize */ + +/** + * 1. Set default font family to sans-serif. + * 2. Prevent iOS text size adjust after orientation change, without disabling + * user zoom. + */ + +html { + font-family: sans-serif; + /* 1 */ + -ms-text-size-adjust: 100%; + /* 2 */ + -webkit-text-size-adjust: 100%; + /* 2 */ +} + +/** + * Remove default margin. + */ + +body { + margin: 0; +} + +/* HTML5 display definitions + ========================================================================== */ + +/** + * Correct `block` display not defined for any HTML5 element in IE 8/9. + * Correct `block` display not defined for `details` or `summary` in IE 10/11 + * and Firefox. + * Correct `block` display not defined for `main` in IE 11. + */ + +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +menu, +nav, +section, +summary { + display: block; +} + +/** + * 1. Correct `inline-block` display not defined in IE 8/9. + * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. + */ + +audio, +canvas, +progress, +video { + display: inline-block; + /* 1 */ + vertical-align: baseline; + /* 2 */ +} + +/** + * Prevent modern browsers from displaying `audio` without controls. + * Remove excess height in iOS 5 devices. + */ + +audio:not([controls]) { + display: none; + height: 0; +} + +/** + * Address `[hidden]` styling not present in IE 8/9/10. + * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. + */ + +[hidden], +template { + display: none; +} + +/* Links + ========================================================================== */ + +/** + * Remove the gray background color from active links in IE 10. + */ + +a { + background-color: transparent; +} + +/** + * Improve readability when focused and also mouse hovered in all browsers. + */ + +a:active, +a:hover { + outline: 0; +} + +/* Text-level semantics + ========================================================================== */ + +/** + * Address styling not present in IE 8/9/10/11, Safari, and Chrome. + */ + +abbr[title] { + border-bottom: 1px dotted; +} + +/** + * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. + */ + +b, +strong { + font-weight: bold; +} + +/** + * Address styling not present in Safari and Chrome. + */ + +dfn { + font-style: italic; +} + +/** + * Address variable `h1` font-size and margin within `section` and `article` + * contexts in Firefox 4+, Safari, and Chrome. + */ + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/** + * Address styling not present in IE 8/9. + */ + +mark { + background: #ff0; + color: #000; +} + +/** + * Address inconsistent and variable font size in all browsers. + */ + +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` affecting `line-height` in all browsers. + */ + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +/* Embedded content + ========================================================================== */ + +/** + * Remove border when inside `a` element in IE 8/9/10. + */ + +img { + border: 0; +} + +/** + * Correct overflow not hidden in IE 9/10/11. + */ + +svg:not(:root) { + overflow: hidden; +} + +/* Grouping content + ========================================================================== */ + +/** + * Address margin not present in IE 8/9 and Safari. + */ + +figure { + margin: 1em 40px; +} + +/** + * Address differences between Firefox and other browsers. + */ + +hr { + box-sizing: content-box; + height: 0; +} + +/** + * Contain overflow in all browsers. + */ + +pre { + overflow: auto; +} + +/** + * Address odd `em`-unit font size rendering in all browsers. + */ + +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} + +/* Forms + ========================================================================== */ + +/** + * Known limitation: by default, Chrome and Safari on OS X allow very limited + * styling of `select`, unless a `border` property is set. + */ + +/** + * 1. Correct color not being inherited. + * Known issue: affects color of disabled elements. + * 2. Correct font properties not being inherited. + * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. + */ + +button, +input, +optgroup, +select, +textarea { + color: inherit; + /* 1 */ + font: inherit; + /* 2 */ + margin: 0; + /* 3 */ +} + +/** + * Address `overflow` set to `hidden` in IE 8/9/10/11. + */ + +button { + overflow: visible; +} + +/** + * Address inconsistent `text-transform` inheritance for `button` and `select`. + * All other form control elements do not inherit `text-transform` values. + * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. + * Correct `select` style inheritance in Firefox. + */ + +button, +select { + text-transform: none; +} + +/** + * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` + * and `video` controls. + * 2. Correct inability to style clickable `input` types in iOS. + * 3. Improve usability and consistency of cursor style between image-type + * `input` and others. + */ + +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; + /* 2 */ + cursor: pointer; + /* 3 */ +} + +/** + * Re-set default cursor for disabled elements. + */ + +button[disabled], +html input[disabled] { + cursor: default; +} + +/** + * Remove inner padding and border in Firefox 4+. + */ + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +/** + * Address Firefox 4+ setting `line-height` on `input` using `!important` in + * the UA stylesheet. + */ + +input { + line-height: normal; +} + +/** + * It's recommended that you don't attempt to style these elements. + * Firefox's implementation doesn't respect box-sizing, padding, or width. + * + * 1. Address box sizing set to `content-box` in IE 8/9/10. + * 2. Remove excess padding in IE 8/9/10. + */ + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; + /* 1 */ + padding: 0; + /* 2 */ +} + +/** + * Fix the cursor style for Chrome's increment/decrement buttons. For certain + * `font-size` values of the `input`, it causes the cursor style of the + * decrement button to change from `default` to `text`. + */ + +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Address `appearance` set to `searchfield` in Safari and Chrome. + * 2. Address `box-sizing` set to `border-box` in Safari and Chrome + * (include `-moz` to future-proof). + */ + +input[type="search"] { + -webkit-appearance: textfield; + /* 1 */ + /* 2 */ + box-sizing: content-box; +} + +/** + * Remove inner padding and search cancel button in Safari and Chrome on OS X. + * Safari (but not Chrome) clips the cancel button when the search input has + * padding (and `textfield` appearance). + */ + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * Define consistent border, margin, and padding. + */ + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +/** + * 1. Correct `color` not being inherited in IE 8/9/10/11. + * 2. Remove padding so people aren't caught out if they zero out fieldsets. + */ + +legend { + border: 0; + /* 1 */ + padding: 0; + /* 2 */ +} + +/** + * Remove default vertical scrollbar in IE 8/9/10/11. + */ + +textarea { + overflow: auto; +} + +/** + * Don't inherit the `font-weight` (applied by a rule above). + * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. + */ + +optgroup { + font-weight: bold; +} + +/* Tables + ========================================================================== */ + +/** + * Remove most spacing between table cells. + */ + +table { + border-collapse: collapse; + border-spacing: 0; +} + +td, +th { + padding: 0; +} + +/*! normalize-legacy-addon | MIT License | https://github.com/cfpb/normalize-legacy-addon */ + +/* ========================================================================== + HTML5 display definitions + ========================================================================== */ + +/* + * Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. + */ + +audio, +canvas, +video { + *display: inline; + *zoom: 1; +} + +/* ========================================================================== + Base + ========================================================================== */ + +/* + * Corrects text resizing oddly in IE 6/7 when body `font-size` is set using + * `em` units. +*/ + +html { + font-size: 100%; +} + +/* + * Addresses `font-family` inconsistency between `textarea` and other form + * elements. + */ + +html, +button, +input, +select, +textarea { + font-family: sans-serif; +} + +/* ========================================================================== + Typography + ========================================================================== */ + +/* + * Addresses font sizes and margins set differently in IE 6/7. + * Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5, + * and Chrome. + */ + +h1 { + margin: 0.67em 0; +} + +h2 { + font-size: 1.5em; + margin: 0.83em 0; +} + +h3 { + font-size: 1.17em; + margin: 1em 0; +} + +h4 { + font-size: 1em; + margin: 1.33em 0; +} + +h5 { + font-size: 0.83em; + margin: 1.67em 0; +} + +h6 { + font-size: 0.75em; + margin: 2.33em 0; +} + +blockquote { + margin: 1em 40px; +} + +/* + * Addresses margins set differently in IE 6/7. + */ + +p, +pre { + margin: 1em 0; +} + +/* + * Corrects font family set oddly in IE 6, Safari 4/5, and Chrome. + */ + +code, +kbd, +pre, +samp { + _font-family: 'courier new', monospace; +} + +/** + * Improve readability of pre-formatted text in all browsers. + */ + +pre { + white-space: pre; + word-wrap: break-word; +} + +/* + * Addresses CSS quotes not supported in IE 6/7. + */ + +q { + quotes: none; +} + +/* + * Addresses `quotes` property not supported in Safari 4. + */ + +q:before, +q:after { + content: ''; + content: none; +} + +/* ========================================================================== + Lists + ========================================================================== */ + +/* + * Addresses margins set differently in IE 6/7. + */ + +dl, +menu, +ol, +ul { + margin: 1em 0; +} + +dd { + margin: 0 0 0 40px; +} + +/* + * Addresses paddings set differently in IE 6/7. + */ + +menu, +ol, +ul { + padding: 0 0 0 40px; +} + +/* + * Corrects list images handled incorrectly in IE 7. + */ + +nav ul, +nav ol { + list-style: none; + list-style-image: none; +} + +/* ========================================================================== + Embedded content + ========================================================================== */ + +/* + * Improves image quality when scaled in IE 7. + */ + +img { + -ms-interpolation-mode: bicubic; +} + +/* ========================================================================== + Forms + ========================================================================== */ + +/* + * Corrects margin displayed oddly in IE 6/7. + */ + +form { + margin: 0; +} + +/* + * 1. Corrects color not being inherited in IE 6/7/8/9. + * 2. Corrects text not wrapping in Firefox 3. + * 3. Corrects alignment displayed oddly in IE 6/7. + */ + +legend { + border: 0; + /* 1 */ + white-space: normal; + /* 2 */ + *margin-left: -7px; + /* 3 */ +} + +/* + * Improves appearance and consistency in all browsers. + */ + +button, +input, +select, +textarea { + vertical-align: baseline; + *vertical-align: middle; +} + +/* + * Removes inner spacing in IE 7 without affecting normal text inputs. + * Known issue: inner spacing remains in IE 6. + */ + +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + *overflow: visible; +} + +/* + * Removes excess padding in IE 7. + * Known issue: excess padding remains in IE 6. + */ + +input[type="checkbox"], +input[type="radio"] { + *height: 13px; + *width: 13px; +} + +/* ========================================================================== + Capital Framework + Button Styling + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-buttons + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Colors + codenotes: + - | + @btn-text + @btn-bg + @btn-bg-hover + @btn-bg-active + @btn__secondary-text + @btn__secondary-bg + @btn__secondary-bg-hover + @btn__secondary-bg-active + @btn__warning-text + @btn__warning-bg + @btn__warning-bg-hover + @btn__warning-bg-active + @btn__disabled-text + @btn__disabled-bg + @btn__disabled-outline + - name: Sizing + codenotes: + - | + @btn-font-size + @btn-v-padding + @btn-v-padding-modifier-ie + @super-btn-font-size + notes: + - "@btn-v-padding-modifier-ie is used to fix the vertical padding bug in + IE for + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn { + display: inline-block; + box-sizing: border-box; + padding: 0.57142857em 1em; + border: 0; + border-radius: 0.28571429em; + margin: 0; + vertical-align: middle; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + font-size: 0.875em; + line-height: normal; + text-decoration: none; + cursor: pointer; + transition: background-color 0.1s; + -webkit-appearance: none; +} + +.lt-ie9 .btn { + font-weight: normal !important; +} + +.btn, +.btn:link, +.btn:visited { + background-color: #0072ce; + color: #ffffff; +} + +.btn:hover, +.btn.hover { + background-color: #328ed8; +} + +.btn:focus, +.btn.focus { + background-color: #328ed8; + outline: 1px dotted #0072ce; + outline-offset: 1px; +} + +.btn:active, +.btn.active { + background-color: #33578e; +} + +button.btn::-moz-focus-inner, +input.btn::-moz-focus-inner { + border: 0; +} + +.btn + .btn { + margin-left: 0.42857143em; +} + +.lt-ie8 { + background: url(null) fixed no-repeat; +} + +.lt-ie8 button.btn, +.lt-ie8 input.btn { + overflow: visible; + padding-top: 0.45714286em; + padding-bottom: 0.45714286em; +} + +/* topdoc + name: Secondary button + family: cf-buttons + notes: + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__secondary, +.btn__secondary:link, +.btn__secondary:visited { + background-color: #75787b; + color: #ffffff; +} + +.btn__secondary:hover, +.btn__secondary.hover { + background-color: #919395; +} + +.btn__secondary:focus, +.btn__secondary.focus { + background-color: #919395; + outline-color: #75787b; +} + +.btn__secondary:active, +.btn__secondary.active { + background-color: #43484e; +} + +/* topdoc + name: Destructive action button + family: cf-buttons + notes: + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__warning, +.btn__warning:link, +.btn__warning:visited { + background-color: #d12124; + color: #ffffff; +} + +.btn__warning:hover, +.btn__warning.hover { + background-color: #da6750; +} + +.btn__warning:focus, +.btn__warning.focus { + background-color: #da6750; + outline-color: #d12124; +} + +.btn__warning:active, +.btn__warning.active { + background-color: #9c301b; +} + +/* topdoc + name: Disabled button + family: cf-buttons + notes: + - "Disabled buttons do not contain separate hover and active states since + they should not be interacted with." + - "Note that the .focus class is for demonstration purposes only and + should not be used in production." + patterns: + - name: Default/hovered/active state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__disabled, +.btn__disabled:link, +.btn__disabled:visited, +.btn__disabled:hover, +.btn__disabled.hover, +.btn__disabled:focus, +.btn__disabled.focus, +.btn__disabled:active, +.btn__disabled.active { + background-color: #e3e4e5; + color: #75787b; + cursor: default; + cursor: not-allowed; +} + +.btn__disabled:focus, +.btn__disabled.focus { + outline-color: #e3e4e5; +} + +/* topdoc + name: Super button + family: cf-buttons + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__super { + padding: 0.61111111em 1.61111111em; + font-size: 1.125em; +} + +.btn__super + .btn__super { + margin-left: 0.33333333em; +} + +.lt-ie8 button.btn__super, +.lt-ie8 input.btn__super { + padding-top: 0.66666667em; + padding-bottom: 0.66666667em; +} + +/* topdoc + name: Button with icons + family: cf-buttons + patterns: + - name: Button icon left + markup: | + + + Anchor Tag + + +
+
+ + + Anchor Tag + + +
+
+ + + Anchor Tag + + +
+
+ + + Anchor Tag + + + - name: Button icon right + markup: | + + Anchor Tag + + + +
+
+ + Anchor Tag + + + +
+
+ + Anchor Tag + + + +
+
+ + Anchor Tag + + + + - name: Just an icon + markup: | + + Search + + + + notes: + - "For accessibility please use the .u-visually-hidden utility class + to add hidden text for screen readers." + tags: + - cf-buttons + - fj-icons +*/ + +.btn_icon__left { + padding: 0 0.75em 0 0; + border-right: 1px solid #ffffff; + border-right: 1px solid rgba(255, 255, 255, 0.4); + margin: 0 0.5em 0 0; +} + +.btn__secondary .btn_icon__left { + border-right-color: #ffffff; + border-right-color: rgba(255, 255, 255, 0.4); +} + +.btn__warning .btn_icon__left { + border-right-color: #ffffff; + border-right-color: rgba(255, 255, 255, 0.4); +} + +.btn__disabled .btn_icon__left { + border-right-color: #75787b; + border-right-color: rgba(117, 120, 123, 0.4); +} + +.btn_icon__right { + padding: 0 0 0 0.75em; + border-right: 0; + border-left: 1px solid #ffffff; + border-left: 1px solid rgba(255, 255, 255, 0.4); + margin: 0 0 0 0.5em; +} + +.btn__secondary .btn_icon__right { + border-left-color: #ffffff; + border-left-color: rgba(255, 255, 255, 0.4); +} + +.btn__warning .btn_icon__right { + border-left-color: #ffffff; + border-left-color: rgba(255, 255, 255, 0.4); +} + +.btn__disabled .btn_icon__right { + border-left-color: #75787b; + border-left-color: rgba(117, 120, 123, 0.4); +} + +/* topdoc + name: Button group modifiers + family: cf-buttons + patterns: + - name: Default buttons in a button group + markup: | + Anchor 1 + Anchor 2 + Anchor 3 +
+
+ + + +
+
+ + + + - name: Super buttons in a button group + markup: | + Anchor 1 + Anchor 2 + Anchor 3 +
+
+ + + +
+
+ + + + tags: + - cf-buttons +*/ + +.btn__grouped { + border-radius: 0; +} + +.btn__grouped-first { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.btn__grouped-last { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.btn__grouped-first + .btn__grouped, +.btn__grouped-first + .btn__grouped-last, +.btn__grouped, +.btn__grouped + .btn__grouped, +.btn__grouped-last, +.btn__grouped + .btn__grouped-last { + margin-left: -0.21428571em; +} + +.btn__grouped-first.btn__super + .btn__grouped.btn__super, +.btn__grouped-first.btn__super + .btn__grouped-last.btn__super, +.btn__grouped.btn__super, +.btn__grouped-last.btn__super, +.btn__grouped.btn__super + .btn__grouped.btn__super, +.btn__grouped.btn__super + .btn__grouped-last.btn__super { + margin-left: -0.16666667em; +} + +/* topdoc + name: Compound button + family: cf-buttons + notes: + - "This pattern requires combining .btn__grouped modifiers with + the .btn__compound-action modifier." + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: All button styles + markup: | + Anchor + + + +
+
+ + +
+
+ Anchor + + + +
+
+ + +
+
+ Anchor + + + +
+
+ + +
+
+ Anchor + + + +
+
+ + +
+
+ Anchor + + + +
+
+ + + tags: + - cf-buttons + - fj-icons +*/ + +.btn__compound-action, +.btn__compound-action:link, +.btn__compound-action:visited { + background-color: #328ed8; +} + +.btn__compound-action:hover, +.btn__compound-action:focus, +.btn__compound-action.hover { + background-color: #0072ce; +} + +.btn__compound-action.btn__secondary { + background-color: #919395; +} + +.btn__compound-action.btn__secondary:hover, +.btn__compound-action.btn__secondary:focus, +.btn__compound-action.btn__secondary.hover { + background-color: #75787b; +} + +.btn__compound-action.btn__warning { + background-color: #da6750; +} + +.btn__compound-action.btn__warning:hover, +.btn__compound-action.btn__warning:focus, +.btn__compound-action.btn__warning.hover { + background-color: #d12124; +} + +.btn__compound-action.btn__disabled, +.btn__compound-action.btn__disabled:hover, +.btn__compound-action.btn__disabled:focus, +.btn__compound-action.btn__disabled.hover { + background-color: #e3e4e5; +} + +.btn__compound-action.btn__super { + padding-left: 1.22222222em; + padding-right: 1.22222222em; +} + +/* topdoc + name: Button link + family: cf-buttons + notes: + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__link { + padding: 0; + border-bottom: 1px dotted #0072ce; + border-radius: 0; + margin: 0.57142857em 0; +} + +.btn__link, +.btn__link:link, +.btn__link:visited { + border-bottom-color: #0072ce; + background-color: transparent; + color: #0072ce; +} + +.btn__link:hover, +.btn__link.hover { + border-bottom: 1px solid #328ed8; + background-color: transparent; + color: #328ed8; +} + +.btn__link:focus, +.btn__link.focus { + border-bottom-style: solid; + background-color: transparent; + outline: thin dotted #0072ce; +} + +.btn__link:active, +.btn__link.active { + border-bottom: 1px solid #33578e; + background-color: transparent; + color: #33578e; +} + +.lt-ie8 button.btn__link, +.lt-ie8 input.btn__link { + padding: 0; +} + +/* topdoc + name: Secondary button link + family: cf-buttons + notes: + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__link.btn__secondary, +.btn__link.btn__secondary:link, +.btn__link.btn__secondary:visited { + border-bottom-color: #75787b; + background-color: transparent; + color: #75787b; +} + +.btn__link.btn__secondary:hover, +.btn__link.btn__secondary.hover { + border-bottom-color: #919395; + color: #919395; +} + +.btn__link.btn__secondary:focus, +.btn__link.btn__secondary.focus { + outline-color: #75787b; +} + +.btn__link.btn__secondary:active, +.btn__link.btn__secondary.active { + border-bottom-color: #43484e; + color: #43484e; +} + +/* topdoc + name: Destructive action button link + family: cf-buttons + notes: + - "Note that the .visited, .hover, .focus, .active classes are for + demonstration purposes only and should not be used in production." + patterns: + - name: Default state + markup: | + Anchor Tag + + + - name: Hovered state + markup: | + Anchor Tag + + + - name: Focused state + markup: | + Anchor Tag + + + - name: Active state + markup: | + Anchor Tag + + + tags: + - cf-buttons +*/ + +.btn__link.btn__warning, +.btn__link.btn__warning:link, +.btn__link.btn__warning:visited { + border-bottom-color: #d12124; + background-color: transparent; + color: #d12124; +} + +.btn__link.btn__warning:hover, +.btn__link.btn__warning.hover { + border-bottom-color: #da6750; + color: #da6750; +} + +.btn__link.btn__warning:focus, +.btn__link.btn__warning.focus { + outline-color: #d12124; +} + +.btn__link.btn__warning:active, +.btn__link.btn__warning.active { + border-bottom-color: #9c301b; + color: #9c301b; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Expandable Styling + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-expandables + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Colors + codenotes: + - | + @expandable-focus + @expandable_label-text + @expandable_link-text + @expandable__padded-bg + @expandable__padded-bg-hover + @expandable__padded-divider + @expandable-group_header-text + @expandable-group_header-bg + @expandable-group-bg + @expandable-group-divider + - name: Sizing + codenotes: + - | + @expandable_link-font-size + tags: + - cf-expandables + - less +*/ + +/* topdoc + name: Recommended expandable pattern + family: cf-expandables + notes: + - "Expandables can be built by combining the basic barebones structure + described in the next section along with more specialized expandable + elements and modifiers described throughout." + - "The following combination is our recommended go-to expandable pattern." + patterns: + - name: Recommended expandable pattern + markup: | + + codenotes: + - | + Pattern structure + ----------------- + .expandable.expandable__padded + .expandable_header.expandable_target + .expandable_header-left.expandable_label + .expandable_header-right.expandable_link + .expandable_cue-open + .cf-icon.cf-icon-plus-round + .expandable_cue-close + .cf-icon.cf-icon-minus-round + .expandable_cue-open + .expandable_cue-close + .expandable_content + tags: + - cf-expandables +*/ + +/* topdoc + name: JS functions + family: cf-expandables + notes: + - "There are a number of available functions that you can call on + .expandable elements." + patterns: + - name: .toggle() + codenotes: + - "Toggles the expandable." + - name: .expand( duration ) + codenotes: + - "Expands the expandable." + - | + duration + Type: number + The animation duration. + Not required. + Defaults to `$.fn.expandable.calculateExpandDuration` or + `$.fn.expandable.calculateCollapseDuration` if excluded. + - name: .collapse( duration ) + codenotes: + - "Collapses the expandable." + - | + duration + Type: number + The animation duration. + Not required. + Defaults to `$.fn.expandable.calculateExpandDuration` or + `$.fn.expandable.calculateCollapseDuration` if excluded. + - name: Example usage + codenotes: + - | + // HTML + + + // JS + // (use .get(0) to get the HTML element, that's what the functions + // are bound to) + $('#my-expandable').get(0).expand(); // Opens the expandable + $('#my-expandable').get(0).collapse(); // Closes the expandable + $('#my-expandable').get(0).toggle(); // Toggles the expandable + tags: + - cf-expandables +*/ + +/* topdoc + name: Barebones expandable + family: cf-expandables + notes: + - "This is the barebones structure for expandables that can be used (along + with other expanable elements and modifiers) to create custom + expandable patterns." + - "In this barebones example there are no visual styles." + patterns: + - name: Barebones expandable + markup: | + + codenotes: + - | + Pattern structure + ----------------- + .expandable + .expandable_target + .expandable_cue-open + .expandable_cue-close + .expandable_content + notes: + - "Use the button tag for the .expandable_target element to allow for + keyboard access." + - "The 'Show' and 'Hide' messages can be customized directly in the HTML + by editing the contents of .expandable_cue-open and + .expandable_cue-close." + - "The aria-pressed attribute on .expandable_target gets automatically + added and updated by JavaScript." + - "The aria-expanded attribute on .expandable_content gets automatically + added and updated by JavaScript." + - name: .expandable__expanded (modifier) + codenotes: + - | + .expandable__expanded + notes: + - "Sometimes you may want the expandable to be open by default. This + is as easy as adding the .expandable__expanded modifier to the + .expandable block." + tags: + - cf-expandables +*/ + +.expandable { + margin-bottom: 1.875em; +} + +.expandable_target { + padding: 0; + border: 0; + background-color: transparent; + cursor: pointer; +} + +.expandable_target:focus { + outline: 1px dotted #101820; + outline-offset: 1px; +} + +.expandable_content:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .expandable_content { + zoom: 1; +} + +/* topdoc + name: Expandable text elements + family: cf-expandables + patterns: + - name: .expandable_label (element) + codenotes: + - | + .expandable_label + markup: | + + Lorem ipsum + + notes: + - "Allows you to add some styled text." + - name: .expandable_link (element) + markup: | + + Lorem ipsum + + codenotes: + - | + .expandable_link + notes: + - "Allows you to add some styled text with a link-like look." + tags: + - cf-expandables +*/ + +.expandable_label { + color: #101820; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; +} + +.lt-ie9 .expandable_label { + font-weight: normal !important; +} + +.expandable_link { + color: #0072ce; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + font-size: 0.875em; + line-height: 1.57142857; +} + +.expandable_link em, +.expandable_link i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .expandable_link em, +.lt-ie9 .expandable_link i { + font-style: normal !important; +} + +.expandable_link strong, +.expandable_link b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .expandable_link strong, +.lt-ie9 .expandable_link b { + font-weight: normal !important; +} + +/* topdoc + name: Animated cues + family: cf-expandables + patterns: + - name: .expandable_cue-open/close__animated (modifier) + codenotes: + - | + .expandable_cue-open__animated + .expandable_cue-close__animated + markup: | + + + tags: + - cf-expandables +*/ + +.expandable_cue-open__animated, +.expandable_cue-close__animated { + transition: 0.25s -webkit-transform; + transition: 0.25s transform; +} + +.expandable_cue-close__animated { + -webkit-transform: rotate(180deg); + -ms-transform: rotate(180deg); + transform: rotate(180deg); +} + +.expandable__expanded .expandable_cue-close__animated { + -webkit-transform: rotate(0); + -ms-transform: rotate(0); + transform: rotate(0); +} + +.expandable__expanded .expandable_cue-open__animated { + -webkit-transform: rotate(-180deg); + -ms-transform: rotate(-180deg); + transform: rotate(-180deg); +} + +/* topdoc + name: Expandable header elements + family: cf-expandables + codenotes: + - | + Pattern structure + ----------------- + .expandable_header + .expandable_header-left + .expandable_header-right + notes: + - "These additional elements are useful for more complicated expandables + that need to convey more information than just 'Show/Hide' before the + user expands it." + patterns: + - name: .expandable_header (element) + codenotes: + - | + .expandable_header + notes: + - "Creates a full-width container to house information that is always + visible." + - "Combine .expandable_header with .expandable_target for a full-width + trigger." + - name: .expandable_header__spaced (modifier) + codenotes: + - | + .expandable_header__spaced + notes: + - "Allows you to add space between .expandable_header and .expandable_content." + - "Inline style usage is for demoing the space between the header and + content and should not be used." + - name: .expandable_header-left, .expandable_header-right (elements) + codenotes: + - | + .expandable_header-left + .expandable_header-right + notes: + - "Allows you to float information left and right." + tags: + - cf-expandables +*/ + +.expandable_header { + display: block; +} + +.expandable_header:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .expandable_header { + zoom: 1; +} + +button.expandable_header { + width: 100%; + text-align: left; +} + +.expandable_header__spaced { + padding-bottom: 0.9375em; +} + +.expandable_header-left { + float: left; +} + +.expandable_header-right { + float: right; +} + +/* topdoc + name: Padded expandable modifier + family: cf-expandables + patterns: + - name: .expandable__padded (modifier) + codenotes: + - | + .expandable__padded + notes: + - "Adds padding and a background color to .expandable_header and + .expandable_content." + - "In addition to using the .expandable__padded modifier you also need + to make sure you are using .expandable_header." + tags: + - cf-expandables +*/ + +.expandable__padded { + margin-bottom: 1.875em; + background: #f1f2f2; +} + +.expandable__padded:hover, +.expandable__padded.expandable__expanded { + background: #e3e4e5; +} + +.expandable__padded .expandable_header { + padding: 0.625em 1em; +} + +.expandable__padded .expandable_content { + margin: 0 1em 1.375em; +} + +.expandable__padded .expandable_content:before { + content: ''; + display: block; + height: 1px; + margin-bottom: 1em; + background: #babbbd; +} + +/* topdoc + name: Expandable groups + family: cf-expandables + patterns: + - name: Standard expandable group + markup: | +
+
Expandable group header
+ + + +
+ codenotes: + - | + Pattern structure + ----------------- + .expandable-group + .expandable-group_header + .expandable.expandable__padded + [...] + .expandable.expandable__padded + [...] + .expandable.expandable__padded + [...] + - name: Accordion-style group + markup: | +
+
Expandable group header
+ + + +
+ codenotes: + - | +
+ notes: + - "Accordions can only show one open expandable at a time." + - "Add the data-accordion=\"true\" attribute to the expandable group to + activate the accordion mode." + tags: + - cf-expandables +*/ + +.expandable-group { + margin-bottom: 1.875em; +} + +.expandable-group_header { + padding: 0.35714286em 1.14285714em; + border-bottom: 1px solid #919395; + background: #f1f2f2; + color: #75787b; + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + margin-bottom: 0; +} + +.lt-ie9 .expandable-group_header { + font-weight: normal !important; +} + +.expandable-group .expandable { + border-bottom: 1px solid #919395; + margin-bottom: 0; + background: #ffffff; +} + +.expandable-group .expandable_label { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; + margin-bottom: 0; +} + +.lt-ie9 .expandable-group .expandable_label { + font-weight: normal !important; +} + +.expandable-group .expandable_content { + margin-bottom: 0; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Form Element Styling + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-forms + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Colors + codenotes: + - | + @input-error + @input-success + - name: Sizing + codenotes: + - | + @input__super-font-size + tags: + - cf-forms + - less +*/ + +/* topdoc + name: Form labels + family: cf-forms + patterns: + - name: Label header + markup: | + + tags: + - cf-forms +*/ + +.form-label-header { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + margin-bottom: 0.71428571em; +} + +.lt-ie9 .form-label-header { + font-weight: normal !important; +} + +/* topdoc + name: Super input + family: cf-forms + patterns: + - name: .input__super + markup: | + + + notes: + - "An input that matches the height of a super button." + tags: + - cf-forms +*/ + +.input__super[type="text"], +.input__super[type="search"], +.input__super[type="email"], +.input__super[type="url"], +.input__super[type="tel"], +.input__super[type="number"] { + padding: 0.55555556em; + font-size: 1.125em; +} + +/* topdoc + name: Input states + family: cf-forms + patterns: + - name: Error state + codenotes: + - .error + notes: + - "See the 'Form icons' section below for guidance on adding icons to + states." + markup: | + + - name: Success state + codenotes: + - .success + notes: + - "See the 'Form icons' section below for guidance on adding icons to + states." + markup: | + + tags: + - cf-forms +*/ + +input[type="text"].error, +input[type="search"].error, +input[type="email"].error, +input[type="url"].error, +input[type="tel"].error, +input[type="number"].error, +select[multiple].error, +textarea.error { + border: 1px solid #d12124; + outline: 1px solid #d12124; +} + +input[type="text"].success, +input[type="search"].success, +input[type="email"].success, +input[type="url"].success, +input[type="tel"].success, +input[type="number"].success, +select[multiple].success, +textarea.success { + border: 1px solid #2cb34a; + outline: 1px solid #2cb34a; +} + +/* topdoc + name: Form icons + family: cf-forms + patterns: + - name: Form input icons + notes: + - "Form input icons add small positioning tweaks to Capital Framework + icons." + markup: | + + + - name: Form input error icon + notes: + - "The icon must be placed directly after the form input in the markup + and the input must use the 'error' class." + - "For invalid fields only use the alert role to call attention to + fields that need immediate attention: + https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role" + markup: | + + + - name: Form input success icon + notes: + - "The icon must be placed directly after the form input in the markup + and the input must use the 'error' class." + - "For valid inputs only use the alert role to indicate that a + previously invalid input is now valid: + https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role" + markup: | + + + tags: + - cf-forms +*/ + +.cf-form_input-icon { + position: relative; + top: 0.3em; + margin-left: 0.2em; + font-size: 1.25em; +} + +.error + .cf-form_input-icon { + color: #d12124; +} + +.success + .cf-form_input-icon { + color: #2cb34a; +} + +/* topdoc + name: Form group + family: cf-forms + notes: + - "A form group is recommended when you need to provide spacing between form + elements and between groups of form elements." + codenotes: + - | + Pattern structure + ----------------- + .form-group + .form-group_item + patterns: + - name: .form-group (block) + markup: | +
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+
+
+ +
+
+ +
+
+ codenotes: + - | + .form-group + notes: + - "Provides sizeable margins between groups of form elements." + - name: .form-group_item (element) + markup: | +
+ +
+
+ +
+
+ +
+ notes: + - "Provides subtle margins between form elements within the same group." + - name: Real world example + markup: | +
+ +
+ +
+
+ +
+
+
+ +
+ +
+
+ +
+
+ tags: + - cf-forms +*/ + +.form-group + .form-group { + margin-top: 1.875em; +} + +.form-group_item + .form-group_item { + margin-top: 0.9375em; +} + +/* topdoc + name: Input with button + family: cf-forms + patterns: + - name: Default input and button + markup: | +
+
+ +
+
+ +
+
+ - name: Super input and button + markup: | +
+
+ +
+
+ +
+
+ tags: + - cf-forms +*/ + +.input-with-btn { + display: block; + position: relative; + margin-left: -15px; + margin-right: -15px; +} + +.input-with-btn_input { + margin-bottom: 0.9375em; +} + +.input-with-btn_input { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 75%; + border-right-width: 0; +} + +.lt-ie8 .input-with-btn_input { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.input-with-btn_input { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 83.33333333%; + border-right-width: 0; +} + +.lt-ie8 .input-with-btn_input { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.input-with-btn_input input { + box-sizing: border-box; + width: 100%; +} + +.input-with-btn_btn { + margin-bottom: 0.9375em; +} + +.input-with-btn_btn { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 25%; +} + +.lt-ie8 .input-with-btn_btn { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.input-with-btn_btn { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 16.66666667%; +} + +.lt-ie8 .input-with-btn_btn { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.input-with-btn_btn .btn { + box-sizing: border-box; + width: 100%; +} + +.input-with-btn_btn .btn__super { + padding-left: 0.83333333em; + padding-right: 0.83333333em; +} + +/* topdoc + name: Button inside input + family: cf-forms + patterns: + - name: Default button inside of an default input + markup: | +
+ + +
+ - name: Super button inside of a super input + markup: | +
+ + +
+ tags: + - cf-forms +*/ + +.btn-inside-input { + position: relative; +} + +.btn-inside-input input[type="text"], +.btn-inside-input input[type="search"], +.btn-inside-input input[type="email"], +.btn-inside-input input[type="url"], +.btn-inside-input input[type="tel"], +.btn-inside-input input[type="number"] { + box-sizing: border-box; + width: 100%; + padding-right: 4.64285714em; +} + +.btn-inside-input input[type="text"].input__super, +.btn-inside-input input[type="search"].input__super, +.btn-inside-input input[type="email"].input__super, +.btn-inside-input input[type="url"].input__super, +.btn-inside-input input[type="tel"].input__super, +.btn-inside-input input[type="number"].input__super { + padding-right: 5em; +} + +.btn-inside-input .btn { + border-bottom-width: 0 !important; + position: absolute; + right: 1.07142857em; + top: 0; +} + +.btn-inside-input .btn__super { + right: 0.83333333em; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Grid mixins + ========================================================================== */ + +/* topdoc + name: Less variables + notes: + - "The following variables are exposed, + allowing you to easily override them before compiling. + Most mixins allows you to further override these values by passing them + arguments." + family: cf-grid + patterns: + - codenotes: + - "@grid_box-sizing-polyfill-path: '/cf-grid/custom-demo/static/css';" + notes: + - "The path where boxsizing.htc is located." + - "This path MUST be overridden in your project and set to a root relative url." + - codenotes: + - "@grid_wrapper-width: 1200px;" + notes: + - "The grid's maximum width in px." + - codenotes: + - "@grid_gutter-width: 30px;" + notes: + - "The fixed width between columns." + - codenotes: + - "@grid_total-columns: 12;" + notes: + - "The total number of columns used in calculating column widths." + - codenotes: + - "@grid_debug" + notes: + - "Gives column blocks a background color if set to true." + tags: + - cf-grid +*/ + +/* topdoc + name: Wrapper + notes: + - "Wrappers are centered containers with a max-width and fixed gutters + that match the gutter widths of columns." + - "To support IE 6/7, ensure that the path to boxsizing.htc is set using + the @grid_box-sizing-polyfill-path Less variable. + Read more: https://github.com/Schepp/box-sizing-polyfill." + family: cf-grid + patterns: + - name: Less mixin + codenotes: + - ".grid_wrapper( @grid_wrapper-width: @grid_wrapper-width )" + notes: + - "You can create wrappers with different max-widths by passing a pixel + value into the mixin." + - name: Usage + codenotes: + - | + .main-wrapper { + .grid_wrapper(); + } + .wide-wrapper { + .grid_wrapper( 1900px ); + } + - | +
+ This container now has left and right padding and a centered max width. +
+
+ This container is the same except it has a wider max-width. +
+ tags: + - cf-grid +*/ + +/* topdoc + name: Columns + family: cf-grid + patterns: + - name: Less mixin + codenotes: + - ".grid_column( @columns: 1; @total: @grid_total-columns; @prefix: 0; @suffix: 0 )" + notes: + - "Computes column widths and prefix/suffix padding." + - "CSS borders are used for fixed gutters." + - name: Usage + codenotes: + - | + .main-wrapper { + .grid_wrapper(); + } + .half { + .grid_column(1, 2); + } + - | +
+
I am half of my parent.
+
I am half of my parent.
+
+ - name: This is a placeholder for documenting prefix and suffix + codenotes: + - "..." + tags: + - cf-grid +*/ + +/* topdoc + name: Push and Pull mixins for source ordering + family: cf-grid + patterns: + - codenotes: + - ".push( @offset: 1, @grid_total-columns: @grid_total-columns )" + - ".pull( @offset: 1, @grid_total-columns: @grid_total-columns )" + - name: Usage + codenotes: + - | + .first { + .grid_column(1, 2); + .grid_pull(1); + } + .second { + .grid_column(1, 2); + .grid_push(1); + } + - | +
+
I am first in the markup but appear after .first.
+
I am second in the markup but appear before .second.
+
+ tags: + - cf-grid +*/ + +/* topdoc + name: Nested columns + notes: + - "Since all cf-grid columns have left and right gutters you will notice + undesireable offsetting when nesting columns. + Normally this is removed with complex selectors or by adding classes + to the first and last column per 'row'. + In cf-grid the way to get around this is by wrapping your columns in a + container that utilizes the .grid_nested-col-group() mixin. + This mixin uses negative left and right margins to pull the columns back + into alignment with parent columns." + - "NOTE: Working this way allows you to easily create responsive grids. + You are free to control the number of columns per 'row' without having + to deal with the first and last columns of each row." + - "NOTE: cf-grids does not use 'rows' and there is no row container. + To clarify, if you have a 12 column grid and place 24 columns inside + of a wrapper cf-grid columns will automaitcally stack into 2 'rows' + of 12." + family: cf-grid + patterns: + - name: Less mixin + codenotes: + - ".grid_nested-col-group()" + - name: Usage + codenotes: + - | + .main-wrapper { + .grid_wrapper(); + } + .cols { + .grid_nested-col-group(); + } + .half { + .grid_column(1, 2); + } + - | +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ tags: + - cf-grid +*/ + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Icons + ========================================================================== */ + +/* topdoc + name: Less variables + family: cf-icons + notes: + - "These variables can be overriden in your project's Less file." + patterns: + - name: CSS prefix + codenotes: + - "@cf-icon-prefix: cf-icon;" + - name: Path to icon font files + codenotes: + - "@cf-icon-path: '../fonts';" + - name: Toggle IE7 support + codenotes: + - "@cf-icon-ie7-support: true;" + notes: + - "More on IE7 support can be found in the 'IE7 Support' section." + tags: + - cf-icons +*/ + +/* topdoc + name: IE7 Support + family: cf-icons + notes: + - "IE7 support is added by using dynamic properties (CSS expressions)." + - "To turn off IE7 support simply set @cf-icon-ie7-support to false." + tags: + - cf-icons +*/ + +/* topdoc + name: The basics + family: cf-icons + patterns: + - name: "@font-face declaration" + - name: Base icon class + notes: + - "The cf-icon-prefix class applies all shared icon styles including the + font family." + - "All icons must use two classes, one for this base class and another + to set the font character. For example: + ." + - "Please use the span element instead of the i element. This avoids + font family cascading conflicts when using an italic webfont on i + elements and then another font for the icons. Note that this issue + only pops up in older versions of Internet Explorer." + tags: + - cf-icons +*/ + +@font-face { + font-family: 'CFPB Minicons'; + src: url('../fonts/cf-icons.eot'); + src: url('../fonts/cf-icons.eot?#iefix') format('embedded-opentype'), url('../fonts/cf-icons.woff') format('woff'), url('../fonts/cf-icons.ttf') format('truetype'), url('../fonts/cf-icons.svg') format('svg'); + font-weight: normal; + font-style: normal; +} + +.cf-icon, +.cf-icon { + font-family: 'CFPB Minicons'; + display: inline-block; + font-style: normal; + font-weight: normal; + line-height: 1; + -webkit-font-smoothing: antialiased; +} + +/* topdoc + name: Navigation icons + family: cf-icons + patterns: + - name: left + markup: | + + + - name: right + markup: | + + + - name: up + markup: | + + + - name: down + markup: | + + + - name: arrow-left + markup: | + + + - name: arrow-right + markup: | + + + - name: arrow-up + markup: | + + + - name: arrow-down + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-left:before { + content: "\e000"; +} + +.lt-ie8 .cf-icon-left { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e000'); +} + +.cf-icon-left-round:before { + content: "\e001"; +} + +.lt-ie8 .cf-icon-left-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e001'); +} + +.cf-icon-right:before { + content: "\e002"; +} + +.lt-ie8 .cf-icon-right { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e002'); +} + +.cf-icon-right-round:before { + content: "\e003"; +} + +.lt-ie8 .cf-icon-right-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e003'); +} + +.cf-icon-up:before { + content: "\e004"; +} + +.lt-ie8 .cf-icon-up { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e004'); +} + +.cf-icon-up-round:before { + content: "\e005"; +} + +.lt-ie8 .cf-icon-up-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e005'); +} + +.cf-icon-down:before { + content: "\e006"; +} + +.lt-ie8 .cf-icon-down { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e006'); +} + +.cf-icon-down-round:before { + content: "\e007"; +} + +.lt-ie8 .cf-icon-down-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e007'); +} + +.cf-icon-arrow-left:before { + content: "\e008"; +} + +.lt-ie8 .cf-icon-arrow-left { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e008'); +} + +.cf-icon-arrow-left-round:before { + content: "\e009"; +} + +.lt-ie8 .cf-icon-arrow-left-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e009'); +} + +.cf-icon-arrow-right:before { + content: "\e010"; +} + +.lt-ie8 .cf-icon-arrow-right { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e010'); +} + +.cf-icon-arrow-right-round:before { + content: "\e011"; +} + +.lt-ie8 .cf-icon-arrow-right-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e011'); +} + +.cf-icon-arrow-up:before { + content: "\e012"; +} + +.lt-ie8 .cf-icon-arrow-up { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e012'); +} + +.cf-icon-arrow-up-round:before { + content: "\e013"; +} + +.lt-ie8 .cf-icon-arrow-up-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e013'); +} + +.cf-icon-arrow-down:before { + content: "\e014"; +} + +.lt-ie8 .cf-icon-arrow-down { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e014'); +} + +.cf-icon-arrow-down-round:before { + content: "\e015"; +} + +.lt-ie8 .cf-icon-arrow-down-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e015'); +} + +/* topdoc + name: Status icons + family: cf-icons + patterns: + - name: approved + markup: | + + + - name: error + markup: | + + + - name: help + markup: | + + + - name: delete + markup: | + + + - name: plus + markup: | + + + - name: minus + markup: | + + + - name: update + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-approved:before { + content: "\e100"; +} + +.lt-ie8 .cf-icon-approved { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e100'); +} + +.cf-icon-approved-round:before { + content: "\e101"; +} + +.lt-ie8 .cf-icon-approved-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e101'); +} + +.cf-icon-error:before { + content: "\e102"; +} + +.lt-ie8 .cf-icon-error { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e102'); +} + +.cf-icon-error-round:before { + content: "\e103"; +} + +.lt-ie8 .cf-icon-error-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e103'); +} + +.cf-icon-help:before { + content: "\e104"; +} + +.lt-ie8 .cf-icon-help { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e104'); +} + +.cf-icon-help-round:before { + content: "\e105"; +} + +.lt-ie8 .cf-icon-help-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e105'); +} + +.cf-icon-delete:before { + content: "\e106"; +} + +.lt-ie8 .cf-icon-delete { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e106'); +} + +.cf-icon-delete-round:before { + content: "\e107"; +} + +.lt-ie8 .cf-icon-delete-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e107'); +} + +.cf-icon-plus:before { + content: "\e108"; +} + +.lt-ie8 .cf-icon-plus { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e108'); +} + +.cf-icon-plus-round:before { + content: "\e109"; +} + +.lt-ie8 .cf-icon-plus-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e109'); +} + +.cf-icon-minus:before { + content: "\e110"; +} + +.lt-ie8 .cf-icon-minus { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e110'); +} + +.cf-icon-minus-round:before { + content: "\e111"; +} + +.lt-ie8 .cf-icon-minus-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e111'); +} + +.cf-icon-update:before { + content: "\e112"; +} + +.lt-ie8 .cf-icon-update { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e112'); +} + +.cf-icon-update-round:before { + content: "\e113"; +} + +.lt-ie8 .cf-icon-update-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e113'); +} + +/* topdoc + name: Social icons + family: cf-icons + patterns: + - name: youtube + markup: | + + + - name: linkedin + markup: | + + + - name: facebook + markup: | + + + - name: flickr + markup: | + + + - name: plus + markup: | + + + - name: github + markup: | + + + - name: email-social + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-youtube:before { + content: "\e200"; +} + +.lt-ie8 .cf-icon-youtube { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e200'); +} + +.cf-icon-youtube-square:before { + content: "\e201"; +} + +.lt-ie8 .cf-icon-youtube-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e201'); +} + +.cf-icon-linkedin:before { + content: "\e202"; +} + +.lt-ie8 .cf-icon-linkedin { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e202'); +} + +.cf-icon-linkedin-square:before { + content: "\e203"; +} + +.lt-ie8 .cf-icon-linkedin-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e203'); +} + +.cf-icon-facebook:before { + content: "\e204"; +} + +.lt-ie8 .cf-icon-facebook { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e204'); +} + +.cf-icon-facebook-square:before { + content: "\e205"; +} + +.lt-ie8 .cf-icon-facebook-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e205'); +} + +.cf-icon-flickr:before { + content: "\e206"; +} + +.lt-ie8 .cf-icon-flickr { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e206'); +} + +.cf-icon-flickr-square:before { + content: "\e207"; +} + +.lt-ie8 .cf-icon-flickr-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e207'); +} + +.cf-icon-twitter:before { + content: "\e208"; +} + +.lt-ie8 .cf-icon-twitter { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e208'); +} + +.cf-icon-twitter-square:before { + content: "\e209"; +} + +.lt-ie8 .cf-icon-twitter-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e209'); +} + +.cf-icon-github:before { + content: "\e210"; +} + +.lt-ie8 .cf-icon-github { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e210'); +} + +.cf-icon-github-square:before { + content: "\e211"; +} + +.lt-ie8 .cf-icon-github-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e211'); +} + +.cf-icon-email-social:before { + content: "\e212"; +} + +.lt-ie8 .cf-icon-email-social { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e212'); +} + +.cf-icon-email-social-square:before { + content: "\e213"; +} + +.lt-ie8 .cf-icon-email-social-square { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e213'); +} + +/* topdoc + name: Communication icons + family: cf-icons + patterns: + - name: web + markup: | + + + - name: email + markup: | + + + - name: mail + markup: | + + + - name: phone + markup: | + + + - name: technology + markup: | + + + - name: fax + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-web:before { + content: "\e300"; +} + +.lt-ie8 .cf-icon-web { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e300'); +} + +.cf-icon-web-round:before { + content: "\e301"; +} + +.lt-ie8 .cf-icon-web-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e301'); +} + +.cf-icon-email:before { + content: "\e302"; +} + +.lt-ie8 .cf-icon-email { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e302'); +} + +.cf-icon-email-round:before { + content: "\e303"; +} + +.lt-ie8 .cf-icon-email-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e303'); +} + +.cf-icon-mail:before { + content: "\e304"; +} + +.lt-ie8 .cf-icon-mail { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e304'); +} + +.cf-icon-mail-round:before { + content: "\e305"; +} + +.lt-ie8 .cf-icon-mail-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e305'); +} + +.cf-icon-phone:before { + content: "\e306"; +} + +.lt-ie8 .cf-icon-phone { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e306'); +} + +.cf-icon-phone-round:before { + content: "\e307"; +} + +.lt-ie8 .cf-icon-phone-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e307'); +} + +.cf-icon-technology:before { + content: "\e308"; +} + +.lt-ie8 .cf-icon-technology { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e308'); +} + +.cf-icon-technology-round:before { + content: "\e309"; +} + +.lt-ie8 .cf-icon-technology-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e309'); +} + +.cf-icon-fax:before { + content: "\e310"; +} + +.lt-ie8 .cf-icon-fax { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e310'); +} + +.cf-icon-fax-round:before { + content: "\e311"; +} + +.lt-ie8 .cf-icon-fax-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e311'); +} + +/* topdoc + name: Document icons + family: cf-icons + patterns: + - name: document + markup: | + + + - name: pdf + markup: | + + + - name: upload + markup: | + + + - name: copy + markup: | + + + - name: edit + markup: | + + + - name: attach + markup: | + + + - name: print + markup: | + + + - name: save + markup: | + + + - name: appendix + markup: | + + + - name: supplement + markup: | + + + - name: rss + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-document:before { + content: "\e400"; +} + +.lt-ie8 .cf-icon-document { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e400'); +} + +.cf-icon-document-round:before { + content: "\e401"; +} + +.lt-ie8 .cf-icon-document-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e401'); +} + +.cf-icon-pdf:before { + content: "\e402"; +} + +.lt-ie8 .cf-icon-pdf { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e402'); +} + +.cf-icon-pdf-round:before { + content: "\e403"; +} + +.lt-ie8 .cf-icon-pdf-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e403'); +} + +.cf-icon-upload:before { + content: "\e404"; +} + +.lt-ie8 .cf-icon-upload { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e404'); +} + +.cf-icon-upload-round:before { + content: "\e405"; +} + +.lt-ie8 .cf-icon-upload-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e405'); +} + +.cf-icon-download:before { + content: "\e406"; +} + +.lt-ie8 .cf-icon-download { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e406'); +} + +.cf-icon-download-round:before { + content: "\e407"; +} + +.lt-ie8 .cf-icon-download-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e407'); +} + +.cf-icon-copy:before { + content: "\e408"; +} + +.lt-ie8 .cf-icon-copy { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e408'); +} + +.cf-icon-copy-round:before { + content: "\e409"; +} + +.lt-ie8 .cf-icon-copy-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e409'); +} + +.cf-icon-edit:before { + content: "\e410"; +} + +.lt-ie8 .cf-icon-edit { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e410'); +} + +.cf-icon-edit-round:before { + content: "\e411"; +} + +.lt-ie8 .cf-icon-edit-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e411'); +} + +.cf-icon-attach:before { + content: "\e412"; +} + +.lt-ie8 .cf-icon-attach { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e412'); +} + +.cf-icon-attach-round:before { + content: "\e413"; +} + +.lt-ie8 .cf-icon-attach-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e413'); +} + +.cf-icon-print:before { + content: "\e414"; +} + +.lt-ie8 .cf-icon-print { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e414'); +} + +.cf-icon-print-round:before { + content: "\e415"; +} + +.lt-ie8 .cf-icon-print-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e415'); +} + +.cf-icon-save:before { + content: "\e416"; +} + +.lt-ie8 .cf-icon-save { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e416'); +} + +.cf-icon-save-round:before { + content: "\e417"; +} + +.lt-ie8 .cf-icon-save-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e417'); +} + +.cf-icon-appendix:before { + content: "\e418"; +} + +.lt-ie8 .cf-icon-appendix { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e418'); +} + +.cf-icon-appendix-round:before { + content: "\e419"; +} + +.lt-ie8 .cf-icon-appendix-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e419'); +} + +.cf-icon-supplement:before { + content: "\e420"; +} + +.lt-ie8 .cf-icon-supplement { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e420'); +} + +.cf-icon-supplement-round:before { + content: "\e421"; +} + +.lt-ie8 .cf-icon-supplement-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e421'); +} + +.cf-icon-rss:before { + content: "\e422"; +} + +.lt-ie8 .cf-icon-rss { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e422'); +} + +.cf-icon-rss-round:before { + content: "\e423"; +} + +.lt-ie8 .cf-icon-rss-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e423'); +} + +/* topdoc + name: Financial product icons + family: cf-icons + patterns: + - name: bank-account + markup: | + + + - name: credit-card + markup: | + + + - name: loan + markup: | + + + - name: money-transfer + markup: | + + + - name: mortgage + markup: | + + + - name: debt-collection + markup: | + + + - name: credit-report + markup: | + + + - name: money + markup: | + + + - name: quick-cash + markup: | + + + - name: contract + markup: | + + + - name: complaint + markup: | + + + - name: getting-credit-card + markup: | + + + - name: buying-car + markup: | + + + - name: paying-college + markup: | + + + - name: owning-home + markup: | + + + - name: debt + markup: | + + + - name: building-credit + markup: | + + + - name: prepaid-cards + markup: | + + + - name: payday-loan + markup: | + + + - name: retirement + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-bank-account:before { + content: "\e500"; +} + +.lt-ie8 .cf-icon-bank-account { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e500'); +} + +.cf-icon-bank-account-round:before { + content: "\e501"; +} + +.lt-ie8 .cf-icon-bank-account-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e501'); +} + +.cf-icon-credit-card:before { + content: "\e502"; +} + +.lt-ie8 .cf-icon-credit-card { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e502'); +} + +.cf-icon-credit-card-round:before { + content: "\e503"; +} + +.lt-ie8 .cf-icon-credit-card-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e503'); +} + +.cf-icon-loan:before { + content: "\e504"; +} + +.lt-ie8 .cf-icon-loan { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e504'); +} + +.cf-icon-loan-round:before { + content: "\e505"; +} + +.lt-ie8 .cf-icon-loan-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e505'); +} + +.cf-icon-money-transfer:before { + content: "\e506"; +} + +.lt-ie8 .cf-icon-money-transfer { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e506'); +} + +.cf-icon-money-transfer-round:before { + content: "\e507"; +} + +.lt-ie8 .cf-icon-money-transfer-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e507'); +} + +.cf-icon-mortgage:before { + content: "\e508"; +} + +.lt-ie8 .cf-icon-mortgage { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e508'); +} + +.cf-icon-mortgage-round:before { + content: "\e509"; +} + +.lt-ie8 .cf-icon-mortgage-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e509'); +} + +.cf-icon-debt-collection:before { + content: "\e510"; +} + +.lt-ie8 .cf-icon-debt-collection { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e510'); +} + +.cf-icon-debt-collection-round:before { + content: "\e511"; +} + +.lt-ie8 .cf-icon-debt-collection-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e511'); +} + +.cf-icon-credit-report:before { + content: "\e512"; +} + +.lt-ie8 .cf-icon-credit-report { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e512'); +} + +.cf-icon-credit-report-round:before { + content: "\e513"; +} + +.lt-ie8 .cf-icon-credit-report-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e513'); +} + +.cf-icon-money:before { + content: "\e514"; +} + +.lt-ie8 .cf-icon-money { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e514'); +} + +.cf-icon-money-round:before { + content: "\e515"; +} + +.lt-ie8 .cf-icon-money-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e515'); +} + +.cf-icon-quick-cash:before { + content: "\e516"; +} + +.lt-ie8 .cf-icon-quick-cash { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e516'); +} + +.cf-icon-quick-cash-round:before { + content: "\e517"; +} + +.lt-ie8 .cf-icon-quick-cash-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e517'); +} + +.cf-icon-contract:before { + content: "\e518"; +} + +.lt-ie8 .cf-icon-contract { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e518'); +} + +.cf-icon-contract-round:before { + content: "\e519"; +} + +.lt-ie8 .cf-icon-contract-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e519'); +} + +.cf-icon-complaint:before { + content: "\e520"; +} + +.lt-ie8 .cf-icon-complaint { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e520'); +} + +.cf-icon-complaint-round:before { + content: "\e521"; +} + +.lt-ie8 .cf-icon-complaint-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e521'); +} + +.cf-icon-getting-credit-card:before { + content: "\e522"; +} + +.lt-ie8 .cf-icon-getting-credit-card { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e522'); +} + +.cf-icon-getting-credit-card-round:before { + content: "\e523"; +} + +.lt-ie8 .cf-icon-getting-credit-card-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e523'); +} + +.cf-icon-buying-car:before { + content: "\e524"; +} + +.lt-ie8 .cf-icon-buying-car { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e524'); +} + +.cf-icon-buying-car-round:before { + content: "\e525"; +} + +.lt-ie8 .cf-icon-buying-car-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e525'); +} + +.cf-icon-paying-college:before { + content: "\e526"; +} + +.lt-ie8 .cf-icon-paying-college { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e526'); +} + +.cf-icon-paying-college-round:before { + content: "\e527"; +} + +.lt-ie8 .cf-icon-paying-college-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e527'); +} + +.cf-icon-owning-home:before { + content: "\e528"; +} + +.lt-ie8 .cf-icon-owning-home { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e528'); +} + +.cf-icon-owning-home-round:before { + content: "\e529"; +} + +.lt-ie8 .cf-icon-owning-home-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e529'); +} + +.cf-icon-debt:before { + content: "\e530"; +} + +.lt-ie8 .cf-icon-debt { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e530'); +} + +.cf-icon-debt-round:before { + content: "\e531"; +} + +.lt-ie8 .cf-icon-debt-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e531'); +} + +.cf-icon-building-credit:before { + content: "\e532"; +} + +.lt-ie8 .cf-icon-building-credit { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e532'); +} + +.cf-icon-building-credit-round:before { + content: "\e533"; +} + +.lt-ie8 .cf-icon-building-credit-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e533'); +} + +.cf-icon-prepaid-cards:before { + content: "\e534"; +} + +.lt-ie8 .cf-icon-prepaid-cards { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e534'); +} + +.cf-icon-prepaid-cards-round:before { + content: "\e535"; +} + +.lt-ie8 .cf-icon-prepaid-cards-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e535'); +} + +.cf-icon-payday-loan:before { + content: "\e536"; +} + +.lt-ie8 .cf-icon-payday-loan { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e536'); +} + +.cf-icon-payday-loan-round:before { + content: "\e537"; +} + +.lt-ie8 .cf-icon-payday-loan-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e537'); +} + +.cf-icon-retirement:before { + content: "\e538"; +} + +.lt-ie8 .cf-icon-retirement { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e538'); +} + +.cf-icon-retirement-round:before { + content: "\e539"; +} + +.lt-ie8 .cf-icon-retirement-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e539'); +} + +/* topdoc + name: Web icons + family: cf-icons + patterns: + - name: user + markup: | + + + - name: wifi + markup: | + + + - name: search + markup: | + + + - name: share + markup: | + + + - name: link + markup: | + + + - name: external-link + markup: | + + + - name: audio-mute + markup: | + + + - name: audio-low + markup: | + + + - name: audio-medium + markup: | + + + - name: audio-max + markup: | + + + - name: favorite + markup: | + + + - name: unfavorite + markup: | + + + - name: bookmark + markup: | + + + - name: unbookmark + markup: | + + + - name: settings + markup: | + + + - name: menu + markup: | + + + - name: lock + markup: | + + + - name: unlock + markup: | + + + - name: clock + markup: | + + + - name: chart + markup: | + + + - name: play + markup: | + + + - name: newspaper + markup: | + + + - name: microphone + markup: | + + + - name: bullhorn + markup: | + + + - name: double-quote + markup: | + + + - name: speech-bubble + markup: | + + + - name: information + markup: | + + + - name: lightbulb + markup: | + + + - name: dialogue + markup: | + + + - name: date + markup: | + + + tags: + - cf-icons +*/ + +.cf-icon-user:before { + content: "\e600"; +} + +.lt-ie8 .cf-icon-user { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e600'); +} + +.cf-icon-user-round:before { + content: "\e601"; +} + +.lt-ie8 .cf-icon-user-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e601'); +} + +.cf-icon-wifi:before { + content: "\e602"; +} + +.lt-ie8 .cf-icon-wifi { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e602'); +} + +.cf-icon-wifi-round:before { + content: "\e603"; +} + +.lt-ie8 .cf-icon-wifi-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e603'); +} + +.cf-icon-search:before { + content: "\e604"; +} + +.lt-ie8 .cf-icon-search { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e604'); +} + +.cf-icon-search-round:before { + content: "\e605"; +} + +.lt-ie8 .cf-icon-search-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e605'); +} + +.cf-icon-share:before { + content: "\e606"; +} + +.lt-ie8 .cf-icon-share { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e606'); +} + +.cf-icon-share-round:before { + content: "\e607"; +} + +.lt-ie8 .cf-icon-share-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e607'); +} + +.cf-icon-link:before { + content: "\e608"; +} + +.lt-ie8 .cf-icon-link { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e608'); +} + +.cf-icon-link-round:before { + content: "\e609"; +} + +.lt-ie8 .cf-icon-link-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e609'); +} + +.cf-icon-external-link:before { + content: "\e610"; +} + +.lt-ie8 .cf-icon-external-link { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e610'); +} + +.cf-icon-external-link-round:before { + content: "\e611"; +} + +.lt-ie8 .cf-icon-external-link-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e611'); +} + +.cf-icon-audio-mute:before { + content: "\e612"; +} + +.lt-ie8 .cf-icon-audio-mute { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e612'); +} + +.cf-icon-audio-mute-round:before { + content: "\e616"; +} + +.lt-ie8 .cf-icon-audio-mute-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e616'); +} + +.cf-icon-audio-low:before { + content: "\e613"; +} + +.lt-ie8 .cf-icon-audio-low { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e613'); +} + +.cf-icon-audio-low-round:before { + content: "\e617"; +} + +.lt-ie8 .cf-icon-audio-low-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e617'); +} + +.cf-icon-audio-medium:before { + content: "\e614"; +} + +.lt-ie8 .cf-icon-audio-medium { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e614'); +} + +.cf-icon-audio-medium-round:before { + content: "\e618"; +} + +.lt-ie8 .cf-icon-audio-medium-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e618'); +} + +.cf-icon-audio-max:before { + content: "\e615"; +} + +.lt-ie8 .cf-icon-audio-max { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e615'); +} + +.cf-icon-audio-max-round:before { + content: "\e619"; +} + +.lt-ie8 .cf-icon-audio-max-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e619'); +} + +.cf-icon-favorite:before { + content: "\e620"; +} + +.lt-ie8 .cf-icon-favorite { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e620'); +} + +.cf-icon-favorite-round:before { + content: "\e621"; +} + +.lt-ie8 .cf-icon-favorite-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e621'); +} + +.cf-icon-unfavorite:before { + content: "\e622"; +} + +.lt-ie8 .cf-icon-unfavorite { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e622'); +} + +.cf-icon-unfavorite-round:before { + content: "\e623"; +} + +.lt-ie8 .cf-icon-unfavorite-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e623'); +} + +.cf-icon-bookmark:before { + content: "\e624"; +} + +.lt-ie8 .cf-icon-bookmark { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e624'); +} + +.cf-icon-bookmark-round:before { + content: "\e625"; +} + +.lt-ie8 .cf-icon-bookmark-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e625'); +} + +.cf-icon-unbookmark:before { + content: "\e626"; +} + +.lt-ie8 .cf-icon-unbookmark { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e626'); +} + +.cf-icon-unbookmark-round:before { + content: "\e627"; +} + +.lt-ie8 .cf-icon-unbookmark-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e627'); +} + +.cf-icon-settings:before { + content: "\e628"; +} + +.lt-ie8 .cf-icon-settings { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e628'); +} + +.cf-icon-settings-round:before { + content: "\e629"; +} + +.lt-ie8 .cf-icon-settings-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e629'); +} + +.cf-icon-menu:before { + content: "\e630"; +} + +.lt-ie8 .cf-icon-menu { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e630'); +} + +.cf-icon-menu-round:before { + content: "\e631"; +} + +.lt-ie8 .cf-icon-menu-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e631'); +} + +.cf-icon-lock:before { + content: "\e632"; +} + +.lt-ie8 .cf-icon-lock { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e632'); +} + +.cf-icon-lock-round:before { + content: "\e633"; +} + +.lt-ie8 .cf-icon-lock-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e633'); +} + +.cf-icon-unlock:before { + content: "\e634"; +} + +.lt-ie8 .cf-icon-unlock { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e634'); +} + +.cf-icon-unlock-round:before { + content: "\e635"; +} + +.lt-ie8 .cf-icon-unlock-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e635'); +} + +.cf-icon-clock:before { + content: "\e636"; +} + +.lt-ie8 .cf-icon-clock { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e636'); +} + +.cf-icon-clock-round:before { + content: "\e637"; +} + +.lt-ie8 .cf-icon-clock-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e637'); +} + +.cf-icon-chart:before { + content: "\e638"; +} + +.lt-ie8 .cf-icon-chart { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e638'); +} + +.cf-icon-chart-round:before { + content: "\e639"; +} + +.lt-ie8 .cf-icon-chart-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e639'); +} + +.cf-icon-play:before { + content: "\e640"; +} + +.lt-ie8 .cf-icon-play { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e640'); +} + +.cf-icon-play-round:before { + content: "\e641"; +} + +.lt-ie8 .cf-icon-play-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e641'); +} + +.cf-icon-newspaper:before { + content: "\e700"; +} + +.lt-ie8 .cf-icon-newspaper { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e700'); +} + +.cf-icon-newspaper-round:before { + content: "\e701"; +} + +.lt-ie8 .cf-icon-newspaper-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e701'); +} + +.cf-icon-microphone:before { + content: "\e702"; +} + +.lt-ie8 .cf-icon-microphone { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e702'); +} + +.cf-icon-microphone-round:before { + content: "\e703"; +} + +.lt-ie8 .cf-icon-microphone-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e703'); +} + +.cf-icon-bullhorn:before { + content: "\e704"; +} + +.lt-ie8 .cf-icon-bullhorn { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e704'); +} + +.cf-icon-bullhorn-round:before { + content: "\e705"; +} + +.lt-ie8 .cf-icon-bullhorn-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e705'); +} + +.cf-icon-double-quote:before { + content: "\e708"; +} + +.lt-ie8 .cf-icon-double-quote { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e708'); +} + +.cf-icon-double-quote-round:before { + content: "\e709"; +} + +.lt-ie8 .cf-icon-double-quote-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e709'); +} + +.cf-icon-speech-bubble:before { + content: "\e710"; +} + +.lt-ie8 .cf-icon-speech-bubble { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e710'); +} + +.cf-icon-speech-bubble-round:before { + content: "\e711"; +} + +.lt-ie8 .cf-icon-speech-bubble-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e711'); +} + +.cf-icon-information:before { + content: "\e712"; +} + +.lt-ie8 .cf-icon-information { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e712'); +} + +.cf-icon-information-round:before { + content: "\e713"; +} + +.lt-ie8 .cf-icon-information-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e713'); +} + +.cf-icon-lightbulb:before { + content: "\e714"; +} + +.lt-ie8 .cf-icon-lightbulb { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e714'); +} + +.cf-icon-lightbulb-round:before { + content: "\e715"; +} + +.lt-ie8 .cf-icon-lightbulb-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e715'); +} + +.cf-icon-dialogue:before { + content: "\e716"; +} + +.lt-ie8 .cf-icon-dialogue { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e716'); +} + +.cf-icon-dialogue-round:before { + content: "\e717"; +} + +.lt-ie8 .cf-icon-dialogue-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e717'); +} + +.cf-icon-date:before { + content: "\e718"; +} + +.lt-ie8 .cf-icon-date { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e718'); +} + +.cf-icon-date-round:before { + content: "\e719"; +} + +.lt-ie8 .cf-icon-date-round { + *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e719'); +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Layout Helpers + ========================================================================== */ + +/* topdoc + name: Content layouts + family: cf-layout + patterns: + - name: Standard content columns + markup: | +
+
+
+ Full-width column (spans 12 columns) +
+
+
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+
+
+ Two thirds-width column (spans 8/12 columns) +
+
+
+ codenotes: + - | + Structural cheat sheet: + ----------------------- + .content-l + .content-l_col + notes: + - "Simplifies use of grid structure inside content containers (like .content-main)." + - "Since .content-l_col's are nested within .content_main extra margins will occur. + The .content-l container uses the grid_nested-col-group mixin to counter this." + - ".content-l_col-RATIO classes default to stacking on mobile and displaying as columns + above mobile-max width (600px). This may not be the desired breakpoint for + all use cases, so mixins are provided to simplify changing column display to + stacked." + - "Three .content-l modifiers handle the stacking overrides for use cases of + .content_main, .content_full, and .content_sidebar containers." + - "Note that the divs with inline styles are for demonstration purposes + only and should not be used in production." + - name: .content-l__full modifier + markup: | +
+
+
+ Full-width column (spans 12 columns) +
+
+
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+
+
+ Two thirds-width column (spans 8/12 columns) +
+
+
+ codenotes: + - .content-l.content-l__full + notes: + - "Designed for use within .content_full containers." + - "Displays .content-l_col-1-2 as columns at tablet sizes & above (600px+)" + - "Displays other common .content-l_col modifiers (.content-l_col-1-3, + .content-l_col-2-3, .content-l_col-3-8, .content-l_col-5-8) + as columns above 767px." + - name: .content-l__main modifier + markup: | +
+
+
+ Full-width column (spans 12 columns) +
+
+
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+
+
+ Two thirds-width column (spans 8/12 columns) +
+
+
+ codenotes: + - .content-l.content-l__main + notes: + - "Designed for use in .content_main containers, which have reduced (75%) width + above tablet sizes to accommodate adjacent sidebar column." + - "Displays .content-l_col-1-2 as columns in the tablet range, 600-800px; + stacked from 800-899, the start of sidebar range; and as columns again at 900px+" + - "Displays other common .content-l_col modifiers (.content-l_col-1-3, .content-l_col-2-3, + .content-l_col-3-8, .content-l_col-5-8) as columns above 900px." + - name: .content-l__sidebar modifier + markup: | +
+
+
+ Full-width column (spans 12 columns) +
+
+
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+ Third-width column (spans 4/12 columns) +
+
+
+
+
+
+ Two thirds-width column (spans 8/12 columns) +
+
+
+ codenotes: + - .content-l.content-l__sidebar + notes: + - "For use in sidebar containers, which are full width only + on tablet widths (600-800px)." + - "Displays .content-l_col-1-2 as columns in the tablet range, + 600-800px, and stacked at all other widths." + - name: Large gutters modifier + markup: | +
+
+
+ Full-width column (spans 12 columns) +
+
+
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+
+ Half-width column (spans 6/12 columns) +
+
+
+ codenotes: + - .content-l.content-l__large-gutters + notes: + - "Adds 30px gutters to all columns by simply adding the + .content-l__large-gutters modifier." + tags: + - cf-layout +*/ + +.content-l { + position: relative; +} + +.content-l { + display: block; + position: relative; + margin-left: -15px; + margin-right: -15px; +} + +.content-l__sidebar .content-l_col.content-l_col-1-3 { + display: block; + width: 100%; +} + +.content-l__sidebar .content-l_col.content-l_col-1-3.content-l_col__before-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.content-l__sidebar .content-l_col.content-l_col-1-3.content-l_col__before-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-1-3.content-l_col__before-divider { + border-left-width: 30px; +} + +.content-l__sidebar .content-l_col.content-l_col-1-3 + .content-l_col.content-l_col-1-3 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-2-3 { + display: block; + width: 100%; +} + +.content-l__sidebar .content-l_col.content-l_col-2-3.content-l_col__before-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.content-l__sidebar .content-l_col.content-l_col-2-3.content-l_col__before-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-2-3.content-l_col__before-divider { + border-left-width: 30px; +} + +.content-l__sidebar .content-l_col.content-l_col-2-3 + .content-l_col.content-l_col-2-3 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-1-3 + .content-l_col.content-l_col-2-3, +.content-l__sidebar .content-l_col.content-l_col-2-3 + .content-l_col.content-l_col-1-3 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-3-8 { + display: block; + width: 100%; +} + +.content-l__sidebar .content-l_col.content-l_col-3-8.content-l_col__before-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.content-l__sidebar .content-l_col.content-l_col-3-8.content-l_col__before-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-3-8.content-l_col__before-divider { + border-left-width: 30px; +} + +.content-l__sidebar .content-l_col.content-l_col-3-8 + .content-l_col.content-l_col-3-8 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-5-8 { + display: block; + width: 100%; +} + +.content-l__sidebar .content-l_col.content-l_col-5-8.content-l_col__before-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.content-l__sidebar .content-l_col.content-l_col-5-8.content-l_col__before-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-5-8.content-l_col__before-divider { + border-left-width: 30px; +} + +.content-l__sidebar .content-l_col.content-l_col-5-8 + .content-l_col.content-l_col-5-8 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-3-8 + .content-l_col.content-l_col-5-8, +.content-l__sidebar .content-l_col.content-l_col-5-8 + .content-l_col.content-l_col-3-8 { + margin-top: 1.875em; +} + +.content-l__sidebar .content-l_col.content-l_col-1-2 { + display: block; + width: 100%; +} + +.content-l__sidebar .content-l_col.content-l_col-1-2.content-l_col__before-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.content-l__sidebar .content-l_col.content-l_col-1-2.content-l_col__before-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-1-2.content-l_col__before-divider { + border-left-width: 30px; +} + +.content-l__sidebar .content-l_col.content-l_col-1-2 + .content-l_col.content-l_col-1-2 { + margin-top: 1.875em; +} + +.content-l__large-gutters { + margin-left: -30px; + margin-right: -30px; +} + +.content-l__large-gutters .content-l_col { + border-left-width: 30px; + border-right-width: 30px; +} + +.content-l_col + .content-l_col { + margin-top: 1.875em; +} + +.content-l_col.content-l_col-1-2 + .content-l_col.content-l_col-1-2, +.content-l_col.content-l_col-1-3 + .content-l_col.content-l_col-1-3, +.content-l_col.content-l_col-3-8 + .content-l_col.content-l_col-3-8, +.content-l_col.content-l_col-3-8 + .content-l_col.content-l_col-5-8, +.content-l_col.content-l_col-5-8 + .content-l_col.content-l_col-3-8 { + margin-top: 0; +} + +.content-l_col-1 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 100%; +} + +.lt-ie8 .content-l_col-1 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content-l_col-1-2 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 50%; +} + +.lt-ie8 .content-l_col-1-2 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content-l_col-1-3 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; +} + +.lt-ie8 .content-l_col-1-3 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content-l_col-2-3 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 66.66666667%; +} + +.lt-ie8 .content-l_col-2-3 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content-l_col-3-8 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 37.5%; +} + +.lt-ie8 .content-l_col-3-8 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content-l_col-5-8 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 62.5%; +} + +.lt-ie8 .content-l_col-5-8 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +/* topdoc + name: Content layout column dividers + family: cf-layout + notes: + - "Adds dividers between specified .content-l_col-X-X classes." + - "Layout dividers work in conjunction with .content-l_col-X-X elements and + have specific needs depending on which column element variant they are + attached to. For example .content-l_col-1-2 has different divider needs + than .content-l_col-1-3 because they may break to single columns at different + breakpoints." + - "Dividers use absolute positioning relative to the .content-l element and + depends on .content-l using `position: relative;`. This allows vertical + dividers to span the height of the tallest column. Just be aware that if + you have more than one row of columns, and each row has columns of + different widths, the borders will cause unwanted overlapping since they + will span the height of the entire .content-l element." + patterns: + - name: .content-l_col__before-divider (modifier) + markup: | +
+
+ +
+ Half-width column (spans 6/12 columns) +
+
+ +
+ Half-width column (spans 6/12 columns) +
+
+
+ +
+
+ Third-width column (spans 4/12 columns) +
+
+ Third-width column (spans 4/12 columns) +
+
+ Third-width column (spans 4/12 columns) +
+
+ codenotes: + - .content-l_col__before-divider + tags: + - cf-layout +*/ + +.content-l_col__before-divider.content-l_col-1-2 { + border-left-width: 30px; +} + +.content-l_col__before-divider.content-l_col-1-2:before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + width: 1px; + display: block; + background-color: #babbbd; + margin-left: -30px; +} + +.content-l_col__before-divider.content-l_col-1-3 { + border-left-width: 30px; +} + +.content-l_col__before-divider.content-l_col-1-3:before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + width: 1px; + display: block; + background-color: #babbbd; + margin-left: -30px; +} + +/* topdoc + name: Content bar + family: cf-layout + patterns: + - name: A 10 pixel bar that divides the header or hero from the main content + markup: | +
+ notes: + - "This is necessary because we don't have a predictable place to put a + full-width border. It needs to be under the hero on pages with + heroes, but under the header if there is no hero." + - ".content_bar must come after .content_hero but before .content_wrapper" + tags: + - cf-layout +*/ + +.content_bar { + height: 10px; + background: #2cb34a; +} + +/* topdoc + name: Content line + family: cf-layout + patterns: + - name: "A 1 pixel edge to edge bar that can divide content." + markup: | +
+ tags: + - cf-layout +*/ + +.content_line { + height: 1px; + background: #babbbd; +} + +/* topdoc + name: Main content and sidebar + family: cf-layout + patterns: + - name: Standard layout for the main content area and sidebar + markup: | +
+
+ Content hero +
+
+
+
+ Main content area +
+ +
+
+ codenotes: + - | + Structural cheat sheet: + ----------------------- + main.content + .content_hero + .content_bar + .content_wrapper + .content_sidebar + .content_main + notes: + - "By default .content_main and .content_sidebar stack vertically. When + using the modifiers described below to create columns, the columns + will remain stacked for smaller screens and then convert to to + columns at 801px." + - ".content_bar must come after .content_hero (if it exists) but before + .content_wrapper." + - "Inline styling is for demonstration purposes only; do not include it + in your markup." + - name: Left-hand navigation layout + markup: | +
+
+
+ +
+

Main content area

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Cum corrupti tempora nam nihil qui mollitia consectetur + corporis nemo culpa dolorum! Laborum at eos deleniti + consequatur itaque officiis debitis quisquam! Provident! +

+
+
+
+
+
+ Footer +
+
+ codenotes: + - .content__1-3 + notes: + - "Add a class of .content__L-R to main.content to determine the width + ratio of .content_main and .content_sidebar, where 'L' is the + left-hand item and 'R' is the right-hand item. The two common + configurations are 1-3 (sidebar on the left, content on the right, in + a ratio of 1:3) and 2-1 (content on the left, sidebar on the right, + in a ratio of 2:1). It is assumed that the content is wider than the + sidebar." + - name: Right-hand sidebar layout + markup: | +
+
+
+
+

Main content area

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Cum corrupti tempora nam nihil qui mollitia consectetur + corporis nemo culpa dolorum! Laborum at eos deleniti + consequatur itaque officiis debitis quisquam! Provident! +

+
+ +
+
+
+
+ Footer +
+
+ codenotes: + - .content__2-1 + notes: + - "Add a class of .content__L-R to main.content to determine the width + ratio of .content_main and .content_sidebar, where 'L' is the + left-hand item and 'R' is the right-hand item. The two common + configurations are 1-3 (sidebar on the left, content on the right, in + a ratio of 1:3) and 2-1 (content on the left, sidebar on the right, + in a ratio of 2:1). It is assumed that the content is wider than the + sidebar." + - "Inline styling is for demonstration purposes only; do not include it + in your markup." + - name: Narrow content column option + markup: | +
+
+
+
+

Main content area

+

+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. + Cum corrupti tempora nam nihil qui mollitia consectetur + corporis nemo culpa dolorum! Laborum at eos deleniti + consequatur itaque officiis debitis quisquam! Provident! +

+
+ +
+
+
+
+ Footer +
+
+ codenotes: + - .content_main__narrow + notes: + - "Add a class of .content_main__narrow to .content_main to get a + one-column (in a 12-column grid) gutter on the right side." + - "Inline styling is for demonstration purposes only; do not include it + in your markup." + - name: Flush bottom modifier + markup: | +
+
+
+ +
+ Main content with no bottom padding... +
+ .content__flush-bottom is very useful when you have a + content block inside of .content_main with a background + and flush sides. +
+
+
+
+
+
+ Footer +
+
+ codenotes: + - .content__flush-bottom + notes: + - "Add a class of .content__flush-bottom to .content_main or + content_sidebar to remove bottom padding." + - name: Flush top modifier (only on small screens) + markup: | +
+
+
+ +
+ Main content +
+
+
+
+
+ Footer +
+
+ codenotes: + - .content__flush-top-on-small + notes: + - "Add a class of .content__flush-top-on-small to .content_main or + .content_sidebar to remove top padding on small screens only. + 'Small' screens in this case refers to the breakpoint where + .content_main and .content_sidebar single column layout." + - name: Flush all modifier (only on small screens) + markup: | +
+
+
+ +
+ Main content +
+
+
+
+
+ Footer +
+
+ codenotes: + - .content__flush-all-on-small + notes: + - "Add a class of .content__flush-all-on-small to .content_main or + .content_sidebar to remove all padding and border-based gutters on + small screens only. 'Small' screens in this case refers to the + breakpoint where .content_main and .content_sidebar single column layout." + tags: + - cf-layout +*/ + +.content_intro, +.content_main, +.content_sidebar { + padding: 1.875em 0.9375em; +} + +.content_intro, +.content_main, +.content_sidebar { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 100%; + padding: 3.75em 0.9375em; +} + +.lt-ie8 .content_intro, +.lt-ie8 .content_main, +.lt-ie8 .content_sidebar { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content_intro, +.content_main, +.content_sidebar { + padding: 3.75em 0; +} + +.content_intro { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 100%; +} + +.lt-ie8 .content_intro { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content__1-3 .content_sidebar { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 25%; + padding-right: 1.875em; +} + +.lt-ie8 .content__1-3 .content_sidebar { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content__1-3 .content_main { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 75%; + position: relative; +} + +.lt-ie8 .content__1-3 .content_main { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content__1-3 .content_main:after { + content: ''; + border-left: 1px solid #babbbd; + position: absolute; + top: 3.75em; + bottom: 0; + left: -1.875em; +} + +.content__2-1 .content_main { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 66.66666667%; +} + +.lt-ie8 .content__2-1 .content_main { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content__2-1 .content_main:after { + right: -1.875em; +} + +.content__2-1 .content_sidebar { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; + padding-left: 1.875em; +} + +.lt-ie8 .content__2-1 .content_sidebar { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.content__flush-bottom { + padding-bottom: 0; +} + +/* topdoc + name: Block + family: cf-layout + notes: + - ".block is a base class with several modifiers that help you separate + chunks of content via margins, padding, borders, and backgrounds." + patterns: + - name: Standard block example + markup: | + Main content... +
+ Content block +
+
+ Content block +
+
+ Content block +
+ codenotes: + - .block + notes: + - "The standard .block class by itself simply adds a margin of twice the + gutter width to the top and bottom." + - name: Flush-top modifier + markup: | + Main content... +
+ Content block with no top margin. +
+
+ Content block +
+ codenotes: + - .block.block__flush-top + notes: + - "Removes the top margin from .block." + - name: Flush-bottom modifier + markup: | + Main content... +
+ Content block with no bottom margin. +
+
+ Content block with no top margin. +
+ codenotes: + - .block.block__flush-bottom + notes: + - "Removes the bottom margin from .block." + - name: Flush-sides modifier + markup: | +
+
+ +
+ Main content... + +
+
+
+ codenotes: + - .block.block__flush-sides + notes: + - "Removes the side margin from .block." + - "Typically used in conjuction with .block__bg to create a 'well' whose + background extends into the left and right gutters. (See below.)" + - name: Border-top modifier + markup: | + Main content... +
+ Content block with top border. +
+ codenotes: + - .block.block__border-top + notes: + - "Adds top border to .block." + - name: Border-bottom modifier + markup: | + Main content... +
+ Content block with bottom border. +
+ codenotes: + - .block.block__border-bottom + notes: + - "Adds bottom border to .block." + - name: Padded-top modifier + markup: | + Main content... +
+ Content block with reduced top margin & added top padding + and border. +
+ codenotes: + - .block.block__padded-top + notes: + - "Breaks top margin into margin & padding. Useful in combination with + block__border-top to add padding between block contents & border." + - name: Padded-bottom modifier + markup: | +
+ Content block with reduced bottom margin & added bottom padding + and border. +
+ Content... + codenotes: + - .block.block__padded-bottom + notes: + - "Breaks bottom margin into margin & padding. Useful in combination with + block__border-bottom to add padding between block contents & border." + - name: Background modifier + markup: | + Main content... +
+ Content block with a background +
+ codenotes: + - .block.block__bg + notes: + - "Adds a background color and padding to .block." + - name: Background and flush-sides modifier combo example + markup: | +
+
+ +
+ Main content... +
+ Content block with a background and flush sides +
+
+
+
+ codenotes: + - .block.block__flush-sides.block__bg + notes: + - "This is an example of combining modifiers to get a flush padded bg + with a .block." + - name: Sub blocks + markup: | +
+
+ Sub content block +
+
+
+
+ Sub content block +
+
+
+
+ Sub content block +
+
+ codenotes: + - .block.block__sub + notes: + - "Useful for when you need some consistent margins between + blocks that are nested within other blocks." + - "Note that the divs with inline styles are for demonstration purposes + only and should not be used in production." + - name: Mixing content blocks with content layouts + markup: | +
+
+
+ Content block that is also a content column. + Notice how my top margins only exist on smaller screens when + I need to stack vertically. +
+
+
+
+ Content block that is also a content column. + Notice how my top margins only exist on smaller screens when + I need to stack vertically. +
+
+
+ codenotes: + - .block.content-l_col + notes: + - "You can safely combine .block with .content-l_col to + achieve a column-based layout at larger screens with no top margins + and a vertical layout at smaller screens that do have margins." + - "Note that the divs with inline styles are for demonstration purposes + only and should not be used in production." + tags: + - cf-layout +*/ + +.block { + margin-top: 3.75em; + margin-bottom: 3.75em; +} + +.block__border-top { + border-top: 1px solid #babbbd; +} + +.block__border-bottom { + border-bottom: 1px solid #babbbd; +} + +.block__flush-top { + margin-top: 0 !important; +} + +.block__flush-bottom { + margin-bottom: 0 !important; +} + +.block__flush-sides { + margin-right: -15px; + margin-left: -15px; +} + +.block__flush-sides { + margin-right: -30px; + margin-left: -30px; +} + +.block__bg { + padding: 1.875em 0.9375em; + background: #f1f2f2; +} + +.block__bg { + padding: 2.8125em 1.875em; +} + +.block__padded-top { + padding-top: 1.875em; + margin-top: 1.875em; +} + +.block__padded-bottom { + padding-bottom: 1.875em; + margin-bottom: 1.875em; +} + +.block__sub { + margin-top: 1.875em; + margin-bottom: 1.875em; +} + +.content-l_col.block, +.content-l_col.block__sub { + margin-top: 0; +} + +/* topdoc + name: Bleedbar sidebar styling + family: cf-layout + patterns: + - name: Give the sidebar a background color that bleeds off the edge of the screen + markup: | +
+
+ Content hero +
+
+
+
+ Main content area +
+ +
+
+ codenotes: + - ".content__bleedbar" + notes: + - "Simply add class .content__bleedbar to main.content." + - "Only supports sidebars on the right, for now." + - "Inline styling is for demonstration purposes only; do not include it + in your markup." + tags: + - cf-layout +*/ + +.content__bleedbar .content_main:after { + content: none; +} + +.content__bleedbar .content_sidebar { + padding: 1.875em 0.9375em; + background: #f1f2f2; +} + +.content__bleedbar { + overflow: hidden; +} + +.content__bleedbar .content_sidebar { + padding: 3.75em 0 0.9375em 1.875em; + margin-left: 0; + position: relative; + z-index: 1; + background: transparent; +} + +.lt-ie8 .content__bleedbar .content_sidebar { + padding-right: 30px; + background: #f1f2f2; +} + +.content__bleedbar .content_wrapper:after { + content: ''; + display: block; + width: 9999px; + border-left: 1px solid #babbbd; + height: 100%; + position: absolute; + top: 0; + z-index: 0; + margin-left: 10px; + background: #f1f2f2; +} + +.content__bleedbar.content__2-1 .content_wrapper:after { + left: 66.666666667%; +} + +.content__bleedbar.content__3-1 .content_wrapper:after { + left: 75%; +} + +/* topdoc + name: cf-grid helpers + family: cf-layout + patterns: + - name: .wrapper (base) + markup: | +
+ Wrapper +
+ notes: + - "Turns an element into a cf-grid wrapper at 801px and above." + - "Includes some explicit declarations for IE8 due to the fact that it + doesn't support media queries." + - name: .wrapper__match-content (modifier) + markup: | +
+ .wrapper.wrapper__match-content + +
+
+
+
+
+ .content_wrapper .content_main + +
+
+
+ notes: + - "The .content area has a visual gutter twice the size of a normal + wrapper because the gutters from the sidebar and main content divs + add to the gutters of the wrapper. This modifier gives you a wrapper + with wider gutters to match the visual gutters of the .content area." + - name: Column divider modifiers + notes: + - "cf-grid columns use left and right borders for fixed margins which + means it's not possible to set visual left and right borders directly + on them. Instead we can use the :before pseudo element and position + it absolutely. The added benefit of doing it this way is that the + border spans the entire height of the next parent using `position: + relative;`. This means that the border will always match the height + of the tallest column in the row." + codenotes: + - .grid_column__top-divider + - .grid_column__left-divider + - | + .my-column-1-2 { + + // Creates a column that spans 6 out of 12 columns. + .grid_column(6, 12); + + // Add a top divider only at screen 599px and smaller. + .respond-to-max(599px { + .grid_column__top-divider(); + }); + + // Add a left divider only at screen 600px and larger. + .respond-to-min(600px, { + .grid_column__left-divider(); + }); + + } + tags: + - cf-layout +*/ + +.wrapper, +.content_wrapper { + max-width: 1170px; + padding: 0 15px; + margin: 0 auto; + position: relative; + clear: both; +} + +.wrapper__match-content, +.content_wrapper__match-content { + padding-left: 15px; + padding-right: 15px; +} + +.wrapper__match-content, +.content_wrapper__match-content { + padding-left: 30px; + padding-right: 30px; + max-width: 1140px; +} + +.lt-ie9 .wrapper, +.lt-ie9 .content_wrapper { + max-width: 960px; +} + +.lt-ie9 body { + min-width: 800px; +} + +.grid_column__top-divider { + margin-top: 3.75em; + border-left-width: 15px; +} + +.grid_column__top-divider:before { + content: ""; + display: block; + height: 1px; + margin-bottom: 1.875em; + background-color: #babbbd; + position: static; + width: 100%; + margin-left: auto !important; +} + +.grid_column__left-divider { + border-left-width: 30px; +} + +.grid_column__left-divider:before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + width: 1px; + display: block; + background-color: #babbbd; + margin-left: -30px; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Pagination Styling + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-pagination + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Colors + codenotes: + - | + @pagination-text + @pagination-bg + - name: Sizing + codenotes: + - | + @pagination-font-size + @pagination-bp + tags: + - cf-pagination + - less +*/ + +/* topdoc + name: Pagination + family: cf-pagination + notes: + - "To enable the component to jump directly to the paginated content place + place #pagination_content directly above your paginated content." + patterns: + - name: Default pagination + markup: | +
+ + + + + tags: + - fj-buttons + - fj-forms +*/ + +.pagination { + display: block; + position: relative; +} + +.pagination_next { + position: absolute; + top: 0; + right: 0; +} + +.pagination_form { + display: block; + padding: 0.3125em 0.3125em 0.375em; + margin: 1em 0 0 0; + background: #e3e4e5; + color: #75787b; + text-align: center; +} + +.pagination_label { + display: inline-block; + margin: 0; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + font-size: 1em; + vertical-align: middle; +} + +.lt-ie8 .pagination_label { + display: inline; +} + +.lt-ie9 .pagination_label { + font-weight: normal !important; +} + +.pagination_current-page, +input[type="number"].pagination_current-page, +input[type="text"].pagination_current-page { + display: inline-block; + width: 2.625em; + margin: 0 0.25em; + font-size: 1em; + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + text-align: right; + vertical-align: middle; +} + +.lt-ie8 .pagination_current-page, +.lt-ie8 input[type="number"].pagination_current-page, +.lt-ie8 input[type="text"].pagination_current-page { + display: inline; +} + +.lt-ie9 .pagination_current-page, +.lt-ie9 input[type="number"].pagination_current-page, +.lt-ie9 input[type="text"].pagination_current-page { + font-weight: normal !important; +} + +.lt-ie8 .pagination_current-page, +.lt-ie8 input[type="number"].pagination_current-page, +.lt-ie8 input[type="text"].pagination_current-page { + margin: 0 4px; +} + +.pagination_submit.btn { + display: inline-block; + margin: 0 0 0 0.875em; + font-size: 1em; + vertical-align: middle; +} + +.lt-ie8 .pagination_submit.btn { + display: inline; +} + +.lt-ie8 .pagination_submit.btn { + padding-left: 0.875em; + margin: 0; + border: none; + text-decoration: underline; +} + +.pagination_form { + margin: 0; + border-radius: 0.25em; +} + +.pagination_prev { + position: absolute; + top: 0; + left: 0; +} + +.pagination_prev, +.pagination_prev:link, +.pagination_prev:visited { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.pagination_next, +.pagination_next:link, +.pagination_next:visited { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Advanced Typography + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-typography + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Colors + codenotes: + - | + @pull-quote_body + @pull-quote_citation + @micro-copy-text + @date-text + @category-slug-text + @category-slug-hover + @header-slug-thin-border + @header-slug-thick-border + @padded-header-text + @padded-header-bg + @padded-header-border + @fancy-slug-text + @fancy-slug-bg + @fancy-slug-border + @meta-header-border + @jump-link__bg + @jump-link__bg-border + @list__branded-bullet + - name: Sizing + codenotes: + - | + @... + tags: + - cf-typography + - less +*/ + +/* topdoc + name: Pull quote + family: cf-typography + patterns: + - name: Default pull quote + markup: | + + notes: + - "Use a pull quote to highlight excerpts from the current work. + This is not to be confused with blockquote which quotes from an + external work." + - "Since a pull quote is an excerpt and repeats content from the + article it's contained within you should use the aside element." + - name: Large pull quote + markup: | + + tags: + - cf-typography +*/ + +.pull-quote_body { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + margin-top: 0; + margin-bottom: 0.95454545em; + font-size: 1.375em; + line-height: 1.27272727; + margin-bottom: 0.54545455em; + color: #101820; +} + +.pull-quote_body em, +.pull-quote_body i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .pull-quote_body em, +.lt-ie9 .pull-quote_body i { + font-style: normal !important; +} + +.pull-quote_body strong, +.pull-quote_body b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .pull-quote_body strong, +.lt-ie9 .pull-quote_body b { + font-weight: normal !important; +} + +.pull-quote_citation { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + color: #75787b; +} + +.lt-ie9 .pull-quote_citation { + font-weight: normal !important; +} + +.pull-quote__large .pull-quote_body { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + margin-top: 0; + margin-bottom: 0.73076923em; + font-size: 1.625em; + line-height: 1.26923077; + margin-bottom: 0.69230769em; +} + +.pull-quote__large .pull-quote_body em, +.pull-quote__large .pull-quote_body i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .pull-quote__large .pull-quote_body em, +.lt-ie9 .pull-quote__large .pull-quote_body i { + font-style: normal !important; +} + +.pull-quote__large .pull-quote_body strong, +.pull-quote__large .pull-quote_body b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .pull-quote__large .pull-quote_body strong, +.lt-ie9 .pull-quote__large .pull-quote_body b { + font-weight: normal !important; +} + +/* topdoc + name: Micro copy + family: cf-typography + patterns: + - name: Standard micro copy + markup: | +

+ Lorem ipsum dolor sit amet +

+ codenotes: + - .micro-copy + - name: Large micro copy + markup: | +

+ Lorem ipsum dolor sit amet +

+ codenotes: + - .micro-copy + tags: + - cf-typography +*/ + +.micro-copy { + color: #75787b; + font-size: 0.875em; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +.micro-copy em, +.micro-copy i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .micro-copy em, +.lt-ie9 .micro-copy i { + font-style: normal !important; +} + +.micro-copy strong, +.micro-copy b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .micro-copy strong, +.lt-ie9 .micro-copy b { + font-weight: normal !important; +} + +.micro-copy__large { + font-size: 1em; +} + +/* topdoc + name: Short description + family: cf-typography + patterns: + - name: .short-desc + markup: | +

I am short description.

+ codenotes: + - .short-desc + - name: .short-desc__large (modifier) + markup: | +

I am large short description.

+ codenotes: + - .short-desc__large + tags: + - cf-typography +*/ + +.short-desc { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +.short-desc em, +.short-desc i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .short-desc em, +.lt-ie9 .short-desc i { + font-style: normal !important; +} + +.short-desc strong, +.short-desc b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .short-desc strong, +.lt-ie9 .short-desc b { + font-weight: normal !important; +} + +.short-desc__large { + font-size: 1.125em; +} + +/* topdoc + name: Date + family: cf-typography + patterns: + - name: Default date + markup: | + + Nov 4, 2013 + + tags: + - cf-typography +*/ + +.date { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + color: #75787b; + white-space: nowrap; +} + +.lt-ie9 .date { + font-weight: normal !important; +} + +/* topdoc + name: Category slug + family: cf-typography + patterns: + - name: Default category slug + markup: | + + + Category: + Consumer finance + + codenotes: + - | + Structural cheat sheet: + ----------------------- + .category-slug + .category-slug_icon + .u-visually-hidden + notes: + - "We suggest using a .u-visually-hidden element to add more context for + screen readers." + tags: + - cf-typography +*/ + +.category-slug { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; + display: inline-block; + margin-bottom: 0.44444444em; + color: #101820; +} + +.lt-ie9 .category-slug { + font-weight: normal !important; +} + +a.category-slug { + color: #101820; + border-color: #101820; +} + +a.category-slug:visited, +a.category-slug.visited { + border-color: #101820; + color: #101820; +} + +a.category-slug:hover, +a.category-slug.hover { + border-color: #7fb8e6; + color: #7fb8e6; +} + +a.category-slug:focus, +a.category-slug.focus { + border-color: #7fb8e6; + color: #7fb8e6; +} + +a.category-slug:active, +a.category-slug.active { + border-color: #101820; + color: #101820; +} + +.category-slug_icon { + margin-right: 0.11111111em; +} + +/* topdoc + name: Header slug + family: cf-typography + patterns: + - name: Default header slug + markup: | +

+ + Blog summary + +

+ codenotes: + - | + Structural cheat sheet: + ----------------------- + .header-slug + .header-slug_inner + tags: + - cf-typography +*/ + +.header-slug { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + margin-bottom: 1.21428571em; + border-top: 1px solid #e3e4e5; +} + +.lt-ie9 .header-slug { + font-weight: normal !important; +} + +.header-slug_inner { + display: inline-block; + padding-top: 0.28571429em; + margin-top: -3px; + border-top: 5px solid #2cb34a; +} + +/* topdoc + name: Padded header + family: cf-typography + patterns: + - name: Default padded header + markup: | +

+ Header +

+ codenotes: + - .padded-header + tags: + - cf-typography +*/ + +.padded-header { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + padding: 0.57142857em 0.71428571em; + margin-bottom: 0; + border-bottom: 1px solid #babbbd; + background: #f1f2f2; + color: #43484e; +} + +.lt-ie9 .padded-header { + font-weight: normal !important; +} + +/* topdoc + name: Fancy slug + family: cf-typography + patterns: + - name: Default fancy slug + markup: | +

+ + + Watchroom + + +

+ codenotes: + - | + Structural cheat sheet: + ----------------------- + .fancy-slug + .fancy-slug_text + .fancy-slug_ribbon-left + .fancy-slug_ribbon-right + tags: + - cf-typography +*/ + +.fancy-slug { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; + position: relative; + height: 1.14285714em; + padding: 0 1.21428571em; + margin-top: 1.14285714em; + margin-bottom: 0.57142857em; + border-top: 1px solid #babbbd; + line-height: 1; + text-align: center; +} + +.lt-ie9 .fancy-slug { + font-weight: normal !important; +} + +.fancy-slug_text { + display: inline-block; + position: relative; + top: -1.14285714em; + padding: 0.57142857em 1.42857143em; + border: 1px solid #babbbd; + background: #ffffff; +} + +.fancy-slug_ribbon-left, +.fancy-slug_ribbon-right { + display: block; + position: absolute; + top: -1px; + width: 1.21428571em; + height: 100%; + border-top: 1px solid #babbbd; + border-bottom: 1px solid #babbbd; +} + +.lt-ie9 .fancy-slug_ribbon-left, +.lt-ie9 .fancy-slug_ribbon-right { + display: none; +} + +.fancy-slug_ribbon-left:before, +.fancy-slug_ribbon-right:before, +.fancy-slug_ribbon-left:after, +.fancy-slug_ribbon-right:after { + display: block; + content: ""; + position: absolute; + z-index: 3; + width: 1.21428571em; + height: 50%; + background: #ffffff; + border: 0 solid #babbbd; +} + +.fancy-slug_ribbon-left { + left: -1.21428571em; +} + +.fancy-slug_ribbon-left:before { + top: 0; + border-left-width: 1px; + -webkit-transform-origin: 0 0; + -ms-transform-origin: 0 0; + transform-origin: 0 0; + -webkit-transform: skewX(33deg); + -ms-transform: skewX(33deg); + transform: skewX(33deg); +} + +.fancy-slug_ribbon-left:after { + bottom: 0; + border-left-width: 1px; + -webkit-transform-origin: 0 100%; + -ms-transform-origin: 0 100%; + transform-origin: 0 100%; + -webkit-transform: skewX(-33deg); + -ms-transform: skewX(-33deg); + transform: skewX(-33deg); +} + +.fancy-slug_ribbon-right { + right: -1.21428571em; +} + +.fancy-slug_ribbon-right:before { + top: 0; + right: 0; + border-right-width: 1px; + -webkit-transform-origin: 100% 0; + -ms-transform-origin: 100% 0; + transform-origin: 100% 0; + -webkit-transform: skewX(-33deg); + -ms-transform: skewX(-33deg); + transform: skewX(-33deg); +} + +.fancy-slug_ribbon-right:after { + right: 0; + bottom: 0; + border-right-width: 1px; + -webkit-transform-origin: 100% 100%; + -ms-transform-origin: 100% 100%; + transform-origin: 100% 100%; + -webkit-transform: skewX(33deg); + -ms-transform: skewX(33deg); + transform: skewX(33deg); +} + +/* topdoc + name: Meta header + family: cf-typography + patterns: + - name: Default meta header + markup: | +
+ + Nov 4, 2013 + + + + Consumer finance + +
+ codenotes: + - | + Structural cheat sheet: + ----------------------- + .meta-header + .meta-header_right + .meta-header_left + notes: + - ".meta-header_right should come first in the markup so that when it + floats to the right it will appear on the same line as .meta-header_left." + - "Note that the example shows .meta-header_left using the + .category-slug pattern and .meta-header_right using the .date pattern + but you could use other patterns in place of them. Or you can even + swap them so that date is attached to .meta-header_left and + .category-slug is attacked to .meta-header_right." + - name: Alternate meta header arrangements + markup: | +
+ + + + + Nov 4, 2013 + +
+
+
+ + + Consumer finance + +
+ notes: + - "Just some random variations to show off what you could do." + tags: + - cf-typography +*/ + +.meta-header { + padding-bottom: 0.5em; + margin-bottom: 0.625em; + border-bottom: 1px solid #babbbd; +} + +.meta-header_left { + margin-bottom: 0; +} + +.meta-header_right { + display: block; + margin-bottom: 0; +} + +.meta-header_right { + float: right; + display: inline-block; +} + +/* topdoc + name: Links with icons + family: cf-typography + notes: + - "Styles to enable adding an icon to a link and preventing the link's + underline from extending under the icon." + - "For the underlined icon prevention to work, you must wrap the link text + with a `span.icon-link_text`. There can be no whitespace between the text + and the opening and closing span tags." + patterns: + - name: Default link with icon + markup: | +

+ For more information, email + + john.smith@cfpb.gov + . + Alternatively, you can + + download the info sheet + . + Oh, you might also want to visit this + + other organization's website + for further details. +

+ + Visit another section of our site + + notes: + - "The modifier names match the cf-icon names of commonly-used icons." + - "Icons appear to the right of a link, by default." + - name: Links with icons on the left (modifier) + markup: | + + john.smith@cfpb.gov +
+ + (123) 456-7890 + + notes: + - "Simply add the `.icon-link__before` modifier to place the icon before + the link text." + - "You can omit the `span.icon-link_text` wrapper if you do not need + an underline on a particular link." + - name: Non-wrapping icon links + markup: | +

+ For more information, email + + john.smith@cfpb.gov + . +

+ notes: + - "Warning: Icons added to inline links can sometimes break onto the + next line. If you want to prevent this, you can add the `__no-wrap` + modifier to `.icon-link`." + tags: + - cf-typography +*/ + +.icon-link { + border-bottom-width: 0; + position: relative; +} + +.icon-link_text { + border-bottom-width: 1px; + border-bottom-style: inherit; +} + +.icon-link:before, +.icon-link:after { + font-family: 'CFPB Minicons'; + display: inline-block; + font-style: normal; + font-weight: normal; + line-height: 1; + -webkit-font-smoothing: antialiased; + margin-right: 1px; + margin-left: 1px; +} + +.icon-link__download:after, +.icon-link__download.icon-link__before:before { + content: "\e406"; +} + +.icon-link__email:after, +.icon-link__email.icon-link__before:before { + content: "\e302"; +} + +.icon-link__external-link:after, +.icon-link__external-link.icon-link__before:before { + content: "\e610"; +} + +.icon-link__fax:after, +.icon-link__fax.icon-link__before:before { + content: "\e310"; +} + +.icon-link__left:after, +.icon-link__left.icon-link__before:before { + content: "\e000"; +} + +.icon-link__mail:after, +.icon-link__mail.icon-link__before:before { + content: "\e304"; +} + +.icon-link__pdf:after, +.icon-link__pdf.icon-link__before:before { + content: "\e402"; +} + +.icon-link__pdf:after, +.icon-link__pdf.icon-link__before:before { + content: "\e402"; +} + +.icon-link__phone:after, +.icon-link__phone.icon-link__before:before { + content: "\e306"; +} + +.icon-link__right:after, +.icon-link__right.icon-link__before:before { + content: "\e002"; +} + +.icon-link__before:after { + content: ''; +} + +.icon-link__no-wrap { + white-space: nowrap; +} + +/* topdoc + name: Styled link + family: cf-typography + patterns: + - name: .styled-link + markup: | + + Default styled link + + codenotes: + - .styled-link + tags: + - cf-typography +*/ + +.styled-link { + border-bottom-width: 1px; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + font-size: 1em; +} + +.lt-ie9 .styled-link { + font-weight: normal !important; +} + +/* topdoc + name: Jump link + family: cf-typography + patterns: + - name: .jump-link + markup: | + + Default jump link + + codenotes: + - .jump-link + - name: .jump-link__large (modifier) + markup: | + + Large jump link + + codenotes: + - .jump-link__large + notes: + - "18px font-size, compared to the default of 16px" + - name: .jump-link__ (modifier) + markup: | + + Jump link using the right icon from cf-icons + + codenotes: + - .jump-link__ + notes: + - ".jump-link extends .icon-link, so all that is needed to add an icon + to a jump link is to add a modifier with the icon's name." + - name: .jump-link__before (modifier) + markup: | + + Jump link with icon on left + + codenotes: + - .jump-link__.jump-link__before + notes: + - "Jump links can also have icons before the text, like icon links." + - name: .jump-link__bg (modifier) + markup: | + + Jump link with grey background and + solid borders on small screens + + codenotes: + - .jump-link__bg + tags: + - cf-typography +*/ + +.jump-link { + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + font-size: 1em; + border-bottom-width: 0; + position: relative; +} + +.lt-ie9 .jump-link { + font-weight: normal !important; +} + +.jump-link_text { + border-bottom-width: 1px; + border-bottom-style: inherit; +} + +.jump-link:before, +.jump-link:after { + font-family: 'CFPB Minicons'; + display: inline-block; + font-style: normal; + font-weight: normal; + line-height: 1; + -webkit-font-smoothing: antialiased; + margin-right: 1px; + margin-left: 1px; +} + +.jump-link__download:after, +.jump-link__download.jump-link__before:before { + content: "\e406"; +} + +.jump-link__email:after, +.jump-link__email.jump-link__before:before { + content: "\e302"; +} + +.jump-link__external-link:after, +.jump-link__external-link.jump-link__before:before { + content: "\e610"; +} + +.jump-link__fax:after, +.jump-link__fax.jump-link__before:before { + content: "\e310"; +} + +.jump-link__left:after, +.jump-link__left.jump-link__before:before { + content: "\e000"; +} + +.jump-link__mail:after, +.jump-link__mail.jump-link__before:before { + content: "\e304"; +} + +.jump-link__pdf:after, +.jump-link__pdf.jump-link__before:before { + content: "\e402"; +} + +.jump-link__pdf:after, +.jump-link__pdf.jump-link__before:before { + content: "\e402"; +} + +.jump-link__phone:after, +.jump-link__phone.jump-link__before:before { + content: "\e306"; +} + +.jump-link__right:after, +.jump-link__right.jump-link__before:before { + content: "\e002"; +} + +.jump-link__before:after { + content: ''; +} + +.jump-link__no-wrap { + white-space: nowrap; +} + +.jump-link__large { + font-size: 1.125em; +} + +/* topdoc + name: Block link + family: cf-typography + patterns: + - name: .block-link + markup: | + + Default block link + + codenotes: + - .block-link + notes: + - "Convert a standard inline link to a block-level element with padding, + background, and borders." + - "Primarily used within a max-width 599px media query (see .jump-link + and .list__links)." + tags: + - cf-typography +*/ + +.block-link { + box-sizing: border-box; + display: block; + padding: 0.625em 1.25em 0.625em 0; + border: dotted #ffffff; + border-width: 1px 0; + margin-right: 0; + width: 100%; + text-align: left; +} + +/* topdoc + name: Unstyled list modifier + family: cf-typography + patterns: + - name: Default example + markup: | + + codenotes: + - .list.list__unstyled + tags: + - cf-typography +*/ + +.list__unstyled { + padding-left: 0; + list-style-type: none; +} + +.list__unstyled .list_item { + margin-left: 0; +} + +/* topdoc + name: Spaced list modifier + family: cf-typography + patterns: + - name: Default example + markup: | + + codenotes: + - .list.list__spaced + tags: + - cf-typography +*/ + +.list__spaced .list_item + .list_item { + margin-top: 1.5em; +} + +/* topdoc + name: Spaced list item modifier + family: cf-typography + patterns: + - name: Default example + markup: | + + tags: + - cf-typography +*/ + +.list_item__spaced { + margin-top: 1.5em; +} + +/* topdoc + name: Horizontal list modifier + family: cf-typography + patterns: + - name: Default example + markup: | + + tags: + - cf-typography +*/ + +.list__horizontal { + padding-left: 0; +} + +.list__horizontal .list_item { + display: inline-block; +} + +.lt-ie8 .list__horizontal .list_item { + display: inline; +} + +.list__horizontal .list_item { + margin-right: 0.25em; + margin-left: 0; +} + +/* topdoc + name: Icon list modifier + family: cf-typography + notes: + - "Set up a list with icons on the left, in place of bullets." + - "Will need some more work to allow lines to wrap." + patterns: + - name: Default example + markup: | +
    +
  • + + List item 1 +
    • +
  • + + List item 1 +
    • +
  • + + List item 1 +
    • +
+ tags: + - cf-typography +*/ + +.list__icons { + padding-left: 0; + list-style-type: none; +} + +.list__icons .list_item { + margin-left: 0; +} + +.list__icons .list_icon { + width: 1.5em; + text-align: center; +} + +/* topdoc + name: Custom bullet mixin + family: cf-typography + patterns: + - name: Custom bullet + codenotes: + - ".custom-bullet(@text, @color, @offset, @size, @font, @type)" + notes: + - "Displays custom bullets to the left of specified elements as :before pseudo elements." + - "To use, pass this mixin values for the bullet to be displayed: text, color, font size, + and offset (distance away from the parent element the bullet should appear). + Font family parameter is optional and defaults to inherited." + - "Bullets are absolutely positioned outside of their parent's flow, + so they will not receive certain properties applied to the parent + (borders, text-decoration, etc)." + - "By default, custom bullets hang outside of their parent's content box + (in the margin or padding if there is any). If you want the bullets to align + with the left boundary of the parent's content box, give the parent a + left margin value equal to the offset." + tags: + - cf-typography +*/ + +/* topdoc + name: Branded list modifier + family: cf-typography + patterns: + - name: Branded list + markup: | +
    +
  • First item
    • +
  • Second item
    • +
  • Third item
    • +
+ codenotes: + - ".list__branded" + notes: + - "Uses .custom-bullet mixin to generate custom main-brand-color square bullets." + tags: + - cf-typography +*/ + +.list__branded li, +.list__branded .list_item { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + list-style-type: none; + position: relative; +} + +.list__branded li em, +.list__branded .list_item em, +.list__branded li i, +.list__branded .list_item i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .list__branded li em, +.lt-ie9 .list__branded .list_item em, +.lt-ie9 .list__branded li i, +.lt-ie9 .list__branded .list_item i { + font-style: normal !important; +} + +.list__branded li strong, +.list__branded .list_item strong, +.list__branded li b, +.list__branded .list_item b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .list__branded li strong, +.lt-ie9 .list__branded .list_item strong, +.lt-ie9 .list__branded li b, +.lt-ie9 .list__branded .list_item b { + font-weight: normal !important; +} + +.list__branded li:before, +.list__branded .list_item:before { + content: "\25AA"; + font-family: inherit; + font-size: 1.375em; + color: #2cb34a; + line-height: 1; + position: absolute; + left: -0.86363636em; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Core Less file + ========================================================================== */ + +/* ========================================================================== + Capital Framework + Less variables + ========================================================================== */ + +/* topdoc + name: Theme variables + family: cf-core + notes: + - "The following color and sizing variables are exposed, allowing you to + easily override them before compiling." + patterns: + - name: Sizing + codenotes: + - | + @base-font-size-px + @base-line-height-px + @base-line-height + @mobile-max + @tablet-min + - name: Colors + codenotes: + - | + @text + @link-text + @link-underline + @link-text-visited + @link-underline-visited + @link-text-hover + @link-underline-hover + @link-text-active + @link-underline-active + @thead-text + @thead-bg + @td-bg + @td-bg-alt + @input-bg + @input-border + @input-border-focus + @input-placeholder + @figure__bordered + tags: + - cf-core +*/ + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Media queries + ========================================================================== */ + +/* topdoc + name: Media query mixins + family: cf-core + notes: + - "These mixins allow us to write consistent media queries using pixel + values, which are easier to remember. The mixins handle converting the + pixels into em's." + patterns: + - name: "min-width/max-width media queries" + codenotes: + - ".respond-to-min(@bp, @rules)" + - ".respond-to-max(@bp, @rules)" + notes: + - "@bp: the breakpoint size in pixels. It will get converted into em's." + - "@rules: a CSS or Less ruleset. Note that it can contain the full set + of Less features." + - name: "min-width/max-width media query usage" + codenotes: + - | + .respond-to-min(768px, { + .title { + font-size: 2em; + } + }); + + Compiles to: + + @media only all and (min-width: 48em) { + .title { + font-size: 2em; + } + } + - name: "min-width/max-width media query range" + codenotes: + - ".respond-to-range(@bp1, @bp2, @rules)" + notes: + - "@bp1: the min-width breakpoint size in pixels. + It will get converted into em's." + - "@bp2: the max-width breakpoint size in pixels. + It will get converted into em's." + - "@rules: a CSS or Less ruleset. Note that it can contain the full set + of Less features." + - name: "min-width/max-width media query range usage" + codenotes: + - | + .respond-to-range(320px, 768px, { + .title { + font-size: 2em; + } + }); + + Compiles to: + + @media only all and (min-width: 20em) and (max-width: 48em) { + .title { + font-size: 2em; + } + } + tags: + - cf-core +*/ + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Utilities + ========================================================================== */ + +/* topdoc + name: JS-only + family: cf-core + patterns: + - name: Setup + codenotes: + - + - | + + notes: + - "First add the .no-js class to the HTML element." + - "Then add the script to your HEAD which removes the .no-js class when + JS is available." + - name: Utility class + codenotes: + - .u-js-only; + notes: + - "Hide stuff when JavaScript isn't available. Depends on having a small + script in the HEAD of your HTML document that removes a .no-js class." + tags: + - cf-core +*/ + +.no-js .u-js-only { + display: none !important; +} + +/* topdoc + name: Clearfix + family: cf-core + patterns: + - name: Utility class + markup: | +
+
+
+ codenotes: + - .u-clearfix; + notes: + - "Use this class to clear floats. For example, without .u-clearfix the + black box would spill into the markup section." + - "More information: http://css-tricks.com/snippets/css/clear-fix/" + tags: + - cf-core +*/ + +.u-clearfix:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .u-clearfix { + zoom: 1; +} + +/* topdoc + name: Visually hidden + family: cf-core + patterns: + - name: Utility class + markup: | +

+ + + Share on Twitter + +

+ codenotes: + - .u-visually-hidden; + notes: + - "Use this class to hide something from view while keeping it + accessible to screen readers." + tags: + - cf-core +*/ + +.u-visually-hidden { + position: absolute; + overflow: hidden; + clip: rect(0 0 0 0); + height: 1px; + width: 1px; + margin: -1px; + padding: 0; + border: 0; +} + +/* topdoc + name: Inline block + family: cf-core + patterns: + - name: Utility class + codenotes: + - .u-inline-block; + notes: + - "Also adds a .lt-ie8 class to hack inline-block for IE 7 and below." + tags: + - cf-core +*/ + +.u-inline-block { + display: inline-block; +} + +.lt-ie8 .u-inline-block { + display: inline; +} + +/* topdoc + name: Floating right + family: cf-core + patterns: + - name: Utility class + codenotes: + - .u-right; + notes: + - "IE7 float: right drop bug fixes:" + - "1. If the float: right follows an element in the html structure that + should be to its left (and not above it), then that preceding + element(s) must be float: left. + http://stackoverflow.com/questions/10981767/clean-css-fix-of-ie7s-float-right-drop-bug#answer-11437688" + - "2. Simply change the markup order so that the element floating right + comes before the element to its left." + tags: + - cf-core +*/ + +.u-right { + float: right; +} + +/* topdoc + name: Break word + family: cf-core + patterns: + - name: Utility class + markup: | +
+ This link should break: +
+ + something@something.com + +
+
+ This link should not: +
+ + something@something.com + +
+ codenotes: + - .u-break-word + notes: + - "Use this on elements where you need the words to break when confined + to small containers." + - "This only works in IE8 when the element with the .u-break-word class + has layout. See + for more information." + tags: + - cf-core +*/ + +.u-break-word { + word-break: break-all; +} + +/* topdoc + name: Align with button + family: cf-core + patterns: + - name: Utility class + codenotes: + - ".u-align-with-btn(@font-size: @base-font-size-px);" + notes: + - "Adds top padding (among other things) to help alignment with buttons." + - "If you pass no arguments then the padding will be calculated using + @base-font-size-px." + - "Pass one argument to use a custom font size to calculate the top + padding." + tags: + - cf-core +*/ + +/* topdoc + name: Flexible proportional containers + family: cf-core + notes: + - "Utilizes intrinsic ratios to create a flexible container that retains its + aspect ratio. When image tags scale they retain their aspect ratio, but if + you need a flexible video you will need to use this mixin." + - "You can read more about intrinsic rations here: + http://alistapart.com/article/creating-intrinsic-ratios-for-video" + patterns: + - name: Default example + markup: | +
+ +
+ notes: + - "Defaults to a 16:19 ratio." + - "Original mixin credit: https://gist.github.com/craigmdennis/6655047" + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container + .u-flexible-container_inner + - name: Background image examples + markup: | +
+
+
+
+ codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container + notes: + - "If you're not using the video or object elements and all you need is + a proportionally cropped or scaling background image with a fluid + container then you can leave out u-flexible-container_inner." + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + - name: 4-3 modifier + markup: | +
+ +
+ codenotes: + - | + Structural sheat sheet: + ----------------------- + .u-flexible-container.u-flexible-container__4-3 + .u-flexible-container_inner + notes: + - "Create your own aspect ratios by using this modifier as an example." + - "Note that inline style usage is being used for demo purposes only. + Please do not use inline styles." + tags: + - cf-core +*/ + +.u-flexible-container { + position: relative; + padding-bottom: 56.25%; + height: 0; +} + +.u-flexible-container_inner { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +.u-flexible-container__4-3 { + position: relative; + padding-bottom: 75%; + height: 0; +} + +/* topdoc + name: Link mixins + family: cf-core + patterns: + - codenotes: + - .u-link__colors(); + notes: + - "Pass this mixin no arguments to color your link states with the + following defaults: :link (default state) pacific, :hover pacific-50, + :focus: pacific, :visited teal, :active navy." + - codenotes: + - .u-link__colors(@c); + notes: + - "Pass this mixin one color to be used on all of the following + states of your link; :link (default state), :visited, :hover, :focus, + :active." + - codenotes: + - .u-link__colors(@c, @h); + notes: + - "Pass this mixin two colors to use the first color for the :link, + :visited, and :active states, and the second color for the :hover and + :focus states." + - codenotes: + - .u-link__colors(@c, @v, @h, @f, @a); + notes: + - "Pass this mixin five colors in 'love/hate' mnemonic order to color + :link, :visited, :hover, :focus, and :active states respectively." + - "Even though this mixin is basically the same as + .u-link__colors-base(@c, @v, @h, @f, @a); we encourage you to use + .u-link__colors(@c, @v, @h, @f, @a) to promote consistency." + - codenotes: + - .u-link__colors(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba); + notes: + - "Allows you to color text and the borders separately." + - "The first five colors in 'love/hate' mnemonic order will color text + for the :link, :visited, :hover, :focus, and :active states + respectively. The last five colors in 'love/hate' mnemonic order will + color the borders for the :link, :visited, :hover, :focus, and :active + states respectively." + - "Even though this mixin is basically the same as + .u-link__colors-base(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba); we + encourage you to use .u-link__colors(@c, @v, @h, @f, @a, @bc, @bv, @bh, @bf, @ba) + to promote consistency." + - codenotes: + - .u-link__colors-base(@c, @v, @h, @f, @a); + notes: + - "This is the base mixin that all .u-link__colors() mixins use. Please + refrain from using this mixin directly in order to promote a + consistent use of mixin names for coloring links throughout this + project. Remember that if you need to set colors for all states of a + link you should use .u-link__colors(@c, @v, @h, @f, @a)." + - codenotes: + - .u-link__border(); + notes: + - "Forces the default bottom border on the :link and :hover states." + - codenotes: + - .u-link__no-border(); + notes: + - "Turn off the default bottom border on the :link and :hover states." + - codenotes: + - .u-link__hover-border(); + notes: + - "Turn off the default bottom border on the :link state and force a + bottom border on the :hover state." + - codenotes: + - .u-link-child__hover(); + notes: + - "When a link has child elements you may want only certain children to + change color when the parent link is hovered. + Pass no arguments to this mixin to color the child element pacific + when the parent link is hovered." + - codenotes: + - .u-link-child__hover(@c); + notes: + - "Pass this mixin one color to color the child element when the parent + link is hovered." + tags: + - cf-core +*/ + +/* topdoc + name: Margin utilities + family: cf-core + patterns: + - name: Utility classes + codenotes: + - .u-m

<#>; + notes: + - "Replace

with the first letter of the position ('t' for top or 'b' + for bottom) and <#> with the pixel value of the margin you want." + - "Available values: 0, 5, 10, 15, 20, 30, 45, 60." + tags: + - cf-core +*/ + +.u-mt0 { + margin-top: 0 !important; +} + +.u-mb0 { + margin-bottom: 0 !important; +} + +.u-mt5 { + margin-top: 5px !important; +} + +.u-mb5 { + margin-bottom: 5px !important; +} + +.u-mt10 { + margin-top: 10px !important; +} + +.u-mb10 { + margin-bottom: 10px !important; +} + +.u-mt15 { + margin-top: 15px !important; +} + +.u-mb15 { + margin-bottom: 15px !important; +} + +.u-mt20 { + margin-top: 20px !important; +} + +.u-mb20 { + margin-bottom: 20px !important; +} + +.u-mt30 { + margin-top: 30px !important; +} + +.u-mb30 { + margin-bottom: 30px !important; +} + +.u-mt45 { + margin-top: 45px !important; +} + +.u-mb45 { + margin-bottom: 45px !important; +} + +.u-mt60 { + margin-top: 60px !important; +} + +.u-mb60 { + margin-bottom: 60px !important; +} + +/* topdoc + name: Width utilities + family: cf-core + patterns: + - name: Percent-based + markup: | +

+ .u-w100pct +
+
+ .u-w90pct +
+
+ .u-w80pct +
+
+ .u-w70pct +
+
+ .u-w60pct +
+
+ .u-w50pct +
+
+ .u-w40pct +
+
+ .u-w30pct +
+
+ .u-w20pct +
+
+ .u-w10pct +
+
+ .u-w75pct +
+
+ .u-w25pct +
+
+ .u-w66pct +
+
+ .u-w33pct +
+ notes: + - "Inline styles are for demonstration purposes only, please don't use + them." + tags: + - cf-core +*/ + +.u-w100pct { + width: 100%; +} + +.u-w90pct { + width: 90%; +} + +.u-w80pct { + width: 80%; +} + +.u-w70pct { + width: 70%; +} + +.u-w60pct { + width: 60%; +} + +.u-w50pct { + width: 50%; +} + +.u-w40pct { + width: 40%; +} + +.u-w30pct { + width: 30%; +} + +.u-w20pct { + width: 20%; +} + +.u-w10pct { + width: 10%; +} + +.u-w75pct { + width: 75%; +} + +.u-w25pct { + width: 25%; +} + +.u-w66pct { + width: 66.66666667%; +} + +.u-w33pct { + width: 33.33333333%; +} + +/* topdoc + name: Width-specific display + family: cf-core + patterns: + - name: Show on mobile + markup: | +
+

The the text in the box below is visible only at widths less than 600px

+
+

Visible on mobile

+
+
+ codenotes: + - ".u-show-on-mobile" + - "Uses 'display:block' to toggle display. Would need to be extended + for inline use cases." + notes: + - "Displays an element only at mobile widths." + - name: Hide on mobile + markup: | +
+

The text in the box below is hidden at widths less than 600px

+
+

Hidden on mobile

+
+
+ codenotes: + - ".u-hide-on-mobile" + notes: + - "Hides an element at mobile widths" + tags: + - cf-core +*/ + +.u-show-on-mobile { + display: none; +} + +/* topdoc + name: Small text utility + family: cf-core + patterns: + - name: .u-small-text (utility class) + markup: | + Lorem ipsum
+ dolor sit amet + codenotes: + - ".u-small-text" + notes: + - "14px text." + - "The utility class should only be used when the default text size is + 16px. For example you wouldn't want to use the class inside of an + `h1` because the `font-size` in the `h1` will make `.u-small-text` + bigger than it should be. See the docs for the `.u-small-text()` + mixin." + - name: .u-small-text() (Less mixin) + codenotes: + - ".u-small-text(@context)" + - | + // Mixin usage: + .example { + font-size: unit(20px / @base-font-size-px, em); + small { + .u-small-text(20px); + } + } + // Compiles to: + .example { + font-size: 1.25em; + } + .example small { + font-size: 0.7em; + } + notes: + - "This mixin enables you to easily create consistent small text by + passing the context `font-size`." + tags: + - cf-core +*/ + +.u-small-text { + font-size: 0.875em; +} + +small { + font-size: 0.875em; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Base styles + ========================================================================== */ + +/* + * Source: http://fast.fonts.net/cssapi/44e8c964-4684-44c6-a6e3-3f3da8787b50.css + * This file has been edited to use absolute URLS so we can concatenate it with + * all of our other styles. + */ + +@font-face { + font-family: "AvenirNextLTW01-Regular"; + src: url("//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Regular"; + src: url("//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/1e9892c0-6927-4412-9874-1b82801ba47a.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/46cf1067-688d-4aab-b0f7-bd942af6efd8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/52a192b1-bea5-4b48-879f-107f009b666f.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#52a192b1-bea5-4b48-879f-107f009b666f") format("svg"); + font-style: normal; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Italic"; + src: url("//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: italic; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Italic"; + src: url("//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/18839597-afa8-4f0b-9abb-4a30262d0da8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585") format("svg"); + font-style: italic; + font-weight: normal; +} + +@font-face { + font-family: "AvenirNextLTW01-Medium"; + src: url("//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: 500; +} + +@font-face { + font-family: "AvenirNextLTW01-Medium"; + src: url("//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/f26faddb-86cc-4477-a253-1e1287684336.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/63a74598-733c-4d0c-bd91-b01bffcd6e69.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/a89d6ad1-a04f-4a8f-b140-e55478dbea80.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#a89d6ad1-a04f-4a8f-b140-e55478dbea80") format("svg"); + font-style: normal; + font-weight: 500; +} + +@font-face { + font-family: "AvenirNextLTW01-Demi"; + src: url("//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("eot"); + font-style: normal; + font-weight: 700; +} + +@font-face { + font-family: "AvenirNextLTW01-Demi"; + src: url("//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50"); + src: url("//fast.fonts.net/dv2/3/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("woff"), url("//fast.fonts.net/dv2/1/a0f4c2f9-8a42-4786-ad00-fce42b57b148.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50") format("truetype"), url("//fast.fonts.net/dv2/11/99affa9a-a5e9-4559-bd07-20cf0071852d.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#99affa9a-a5e9-4559-bd07-20cf0071852d") format("svg"); + font-style: normal; + font-weight: 700; +} + +/* topdoc + name: Webfonts + family: cf-core + patterns: + - name: Licensed webfonts + notes: + - "Avenir Next is included via the licensed-fonts.css file. + This file contains absolute links to our paid font service. + Fonts included this way will only work on CFPB-registered domains." + - "Note that when using Avenir Regular we automatically fix faux italic + and bold issues by overriding i, em, b, and strong tags to use the + appropriate fonts." + - name: Webfont mixins + codenotes: + - ".webfont-regular()" + - ".webfont-italic()" + - ".webfont-medium()" + - ".webfont-demi()" + notes: + - "Use these mixins to easily add the Avenir Next font family to your + elements." + - "To avoid faux bold and italics in Avenir Next, you must use the font + family name for that particular style. So when defining an italic or + bold style in Avenir Next you need to use the Avenir Next Italic font + family. Use the mixins when setting bold or italic text as they also + set the appropriate font-weight and font-style." + - "These mixins also add the appropriate .lt-ie9 overrides. + .lt-ie9 overrides are necessary to override font-style and font-weight + each time the webfont is used. These overrides are built into the webfont + mixins so you get them automatically. Note that this requires you to + use conditional classes on the element: + https://github.com/h5bp/html5-boilerplate/blob/v4.3.0/doc/html.md#conditional-html-classes." + tags: + - cf-core +*/ + +/* topdoc + name: Type hierarchy + family: cf-core + patterns: + - name: Default body type + markup: | +

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

+ - name: Heading level 1 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h2. + - name: Heading level 2 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h3. + - name: Heading level 3 + markup: | +

Example heading element

+

A non-heading element

+ notes: + - Responsive header. At mobile sizes, displays as h4. + - name: Heading level 4 + markup: | +

Example heading element

+

A non-heading element

+ - name: Heading level 5 + markup: | +
Example heading element
+

A non-heading element

+ - name: Heading level 6 + markup: | +
Example heading element
+

A non-heading element

+ - name: Super header + markup: | +

Example super heading

+

Example super heading

+ tags: + - cf-core +*/ + +body { + color: #101820; + font-family: Georgia, "Times New Roman", serif; + font-size: 100%; + line-height: 1.375; +} + +h1, +.h1, +h2, +.h2, +h3, +.h3 { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +h1 em, +.h1 em, +h2 em, +.h2 em, +h3 em, +.h3 em, +h1 i, +.h1 i, +h2 i, +.h2 i, +h3 i, +.h3 i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 h1 em, +.lt-ie9 .h1 em, +.lt-ie9 h2 em, +.lt-ie9 .h2 em, +.lt-ie9 h3 em, +.lt-ie9 .h3 em, +.lt-ie9 h1 i, +.lt-ie9 .h1 i, +.lt-ie9 h2 i, +.lt-ie9 .h2 i, +.lt-ie9 h3 i, +.lt-ie9 .h3 i { + font-style: normal !important; +} + +h1 strong, +.h1 strong, +h2 strong, +.h2 strong, +h3 strong, +.h3 strong, +h1 b, +.h1 b, +h2 b, +.h2 b, +h3 b, +.h3 b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 h1 strong, +.lt-ie9 .h1 strong, +.lt-ie9 h2 strong, +.lt-ie9 .h2 strong, +.lt-ie9 h3 strong, +.lt-ie9 .h3 strong, +.lt-ie9 h1 b, +.lt-ie9 .h1 b, +.lt-ie9 h2 b, +.lt-ie9 .h2 b, +.lt-ie9 h3 b, +.lt-ie9 .h3 b { + font-weight: normal !important; +} + +h1, +.h1 { + margin-top: 0; + margin-bottom: 0.47058824em; + font-size: 2.125em; + line-height: 1.29411765; +} + +h2, +.h2 { + margin-top: 0; + margin-bottom: 0.73076923em; + font-size: 1.625em; + line-height: 1.26923077; +} + +h3, +.h3 { + margin-top: 0; + margin-bottom: 0.95454545em; + font-size: 1.375em; + line-height: 1.27272727; +} + +h4, +.h4 { + margin-top: 0; + margin-bottom: 1.16666667em; + font-size: 1.125em; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; + line-height: 1.22222222; +} + +.lt-ie9 h4, +.lt-ie9 .h4 { + font-weight: normal !important; +} + +h5, +h6, +.h5, +.h6 { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + letter-spacing: 1px; + text-transform: uppercase; +} + +.lt-ie9 h5, +.lt-ie9 h6, +.lt-ie9 .h5, +.lt-ie9 .h6 { + font-weight: normal !important; +} + +h5, +.h5 { + margin-top: 0; + margin-bottom: 0.35714286em; + font-size: 0.875em; + line-height: 1.57142857; +} + +h6, +.h6 { + margin-top: 0; + margin-bottom: 0.41666667em; + font-size: 0.75em; + line-height: 1.83333333; +} + +.superheader { + margin-bottom: 0.1875em; + font-size: 3em; + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + line-height: 1.25; +} + +.lt-ie9 .superheader { + font-weight: normal !important; +} + +/* topdoc + name: Margins + family: cf-core + patterns: + - name: Consistent vertical margins + notes: + - "Assumes that the font size of each of these items remains the default." + markup: | +

Paragraph margin example

+

Paragraph margin example

+ tags: + - cf-core +*/ + +p, +ul, +ol, +dl, +table, +figure { + margin-top: 0; + margin-bottom: 1.25em; +} + +/* topdoc + name: Default link + notes: + - "Note that the .visited, .hover, .focus, .active classes are for demonstration purposes only and should not + be used in production." + family: cf-core + patterns: + - name: Default state + markup: | + Default link style + - name: Visited state + markup: | + Visited link style + - name: Hovered state + markup: | + Hovered link style + - name: Focused state + markup: | + Focused link style + - name: Active state + markup: | + Active link style + tags: + - cf-core +*/ + +a { + border-width: 0; + border-style: dotted; + border-color: #0072ce; + color: #0072ce; + text-decoration: none; +} + +a:visited, +a.visited { + border-color: #005e5d; + color: #005e5d; +} + +a:hover, +a.hover { + border-style: solid; + border-color: #7fb8e6; + color: #7fb8e6; +} + +a:focus, +a.focus { + border-style: solid; + outline: thin dotted; +} + +a:active, +a.active { + border-style: solid; + border-color: #002d72; + color: #002d72; +} + +/* topdoc + name: Underlined links + family: cf-core + patterns: + - name: States + notes: + - "Note that the .visited, .hover, .focus, .active classes are for demonstration purposes only and should not + be used in production." + - "The underline style properties are mostly set above in the a tag. + To enable the underline simply set a bottom-border-width as done here." + markup: | +

+ Default, + Visited, + Hovered, + Focused, + Active +

+ - name: Underline conditions + notes: + - "We're restricting link borders to links within p, li, and dd so that + we don't have to override them every time we want a plain link." + markup: | +

+ A child of a paragraph +

+ +
+
+ Definition list term +
+
+ A child of a definition list description +
+
+ - name: Exceptions for underlined links + notes: + - "Inline text links inside of a nav element are not underlined." + markup: | + + tags: + - cf-core +*/ + +p a, +li a, +dd a { + border-bottom-width: 1px; +} + +nav a { + border-bottom-width: 0; +} + +/* topdoc + name: Lists + family: cf-core + patterns: + - name: Unordered list + markup: | +
    +
  • List item
    • +
  • List item
    • +
  • List item
    • +
+ tags: + - cf-core +*/ + +ul { + list-style: square; +} + +/* topdoc + name: Tables + family: cf-core + patterns: + - name: Standard table + markup: | + + + + + + + + + + + + + + + + + + + + + + + + + +
Column 1 headerColumn 2 headerColumn 3 header
Row 1 headerRow 1, column 2Row 1, column 3
Row 2 headerRow 2, column 2Row 2, column 3
Row 3 headerRow 3, column 2Row 3, column 3
+ - name: Compact table + markup: | + + + + + + + + + + + + + + + + + + + + + + + + + +
Column 1 headerColumn 2 headerColumn 3 header
Row 1 headerRow 1, column 2Row 1, column 3
Row 2 headerRow 2, column 2Row 2, column 3
Row 3 headerRow 3, column 2Row 3, column 3
+ notes: + - Reduces cell padding to 10px. + tags: + - cf-core +*/ + +table { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +table em, +table i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 table em, +.lt-ie9 table i { + font-style: normal !important; +} + +table strong, +table b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 table strong, +.lt-ie9 table b { + font-weight: normal !important; +} + +th, +td { + padding: 0.75em 0.9375em; + background: #f8f8f8; +} + +thead th, +thead td { + color: #ffffff; + background: #43484e; +} + +tbody > tr:nth-child(odd) > th, +tbody > tr:nth-child(odd) > td { + background: #f1f2f2; +} + +.compact-table th, +.compact-table td { + padding: 0.4375em 0.625em; +} + +th { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; + text-align: left; +} + +.lt-ie9 th { + font-weight: normal !important; +} + +/* topdoc + name: Block quote + family: cf-core + patterns: + - name: Default block quote + markup: | +
+ Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa + similique fugit hic eligendi praesentium officiis illum optio iusto + commodi eum tempore nisi ad in perferendis enim quo dolores. + Reprehenderit similique earum quibusdam possimus vitae esse + nesciunt mollitia sed beatae aliquid dolores iure a impedit quam + minus eum modi illum ducimus eligendi eveniet labore non sequi + voluptate et totam praesentium animi itaque asperiores dolorum + sunt laudantium repellat nam commodi. Perspiciatis natus aliquam + veniam officiis ducimus voluptatum ut necessitatibus non! +
+ notes: + - "Use a block quote to quote from an external work. See .pull-quote if + you need to highlight an excerpt from the current work." + - "It is best practice to document the URL of a quoted work using the + cite attribute." + tags: + - cf-core +*/ + +blockquote { + margin: 1.25em; +} + +blockquote { + margin: 1.75em 2.5em; +} + +/* topdoc + name: Form labels + family: cf-core + notes: + - "Visit https://github.com/cfpb/cf-forms for advanced form label patterns." + patterns: + - name: Default label + markup: | + + - name: Label wrapping a radio or checkbox + markup: | + + + tags: + - cf-core +*/ + +label { + display: block; + margin-bottom: 0.3125em; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +label em, +label i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 label em, +.lt-ie9 label i { + font-style: normal !important; +} + +label strong, +label b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 label strong, +.lt-ie9 label b { + font-weight: normal !important; +} + +label input[type="radio"], +label input[type="checkbox"] { + margin-right: 0.375em; +} + +/* topdoc + name: Form elements + family: cf-core + notes: + - "The .focus class is only included for documentation demos and should + not be used in production." + - "Visit https://github.com/cfpb/cf-forms for advanced form field patterns." + patterns: + - name: type="text" + markup: | + + +

+ + - name: type="search" + markup: | + + +

+ + - name: type="email" + markup: | + + +

+ + - name: type="url" + markup: | + + +

+ + - name: type="tel" + markup: | + + +

+ + - name: type="number" + markup: | + + +

+ + - name: textarea + markup: | + + + - name: multi-select + markup: | + + + tags: + - cf-core +*/ + +input[type="text"], +input[type="search"], +input[type="email"], +input[type="url"], +input[type="tel"], +input[type="number"], +textarea, +select[multiple] { + display: inline-block; + margin: 0; + padding: 0.375em; + font-family: Arial, sans-serif; + font-size: 1em; + background: #ffffff; + border: 1px solid #75787b; + border-radius: 0; + vertical-align: top; + -webkit-appearance: none; + -webkit-user-modify: read-write-plaintext-only; +} + +::-webkit-search-decoration { + -webkit-appearance: none; +} + +input[type="text"]:focus, +input[type="text"].focus, +input[type="search"]:focus, +input[type="search"].focus, +input[type="email"]:focus, +input[type="email"].focus, +input[type="url"]:focus, +input[type="url"].focus, +input[type="tel"]:focus, +input[type="tel"].focus, +input[type="number"]:focus, +input[type="number"].focus, +textarea:focus, +textarea.focus, +select[multiple]:focus, +select[multiple].focus { + border: 1px solid #0072ce; + outline: 1px solid #0072ce; + outline-offset: 0; + box-shadow: none; +} + +::-webkit-input-placeholder { + color: #75787b; +} + +::-moz-placeholder { + color: #75787b; +} + +:-ms-input-placeholder { + color: #75787b; +} + +/* topdoc + name: Images + family: cf-core + patterns: + - name: max-width + markup: | + + notes: + - "Gives all images a default max-width of 100% of their container." + tags: + - cf-core +*/ + +img { + max-width: 100%; +} + +/* topdoc + name: Figure + family: cf-core + patterns: + - name: figure + markup: | +
+ +
+ - name: figure.figure__bordered + markup: | +
+ +
+ tags: + - cf-core +*/ + +figure { + margin-left: 0; + margin-right: 0; +} + +figure img { + vertical-align: middle; +} + +.figure__bordered img { + border: 1px solid #babbbd; +} + +/* topdoc + name: EOF + eof: true +*/ + +/* ========================================================================== + Capital Framework + Color variables + ========================================================================== */ + +/* ========================================================================== + Capital Framework theme overrides + ========================================================================== */ + +/* cf-core + ========================================================================== */ + +/* cf-buttons + ========================================================================== */ + +/* cf-expandables + ========================================================================== */ + +/* cf-forms + ========================================================================== */ + +/* cf-grid + ========================================================================== */ + +/* cf-icons + ========================================================================== */ + +/* cf-layout + ========================================================================== */ + +/* cf-pagination + ========================================================================== */ + +/* cf-typography + ========================================================================== */ + +.intro-message { + padding: 1em; + background: #f1f2f2; + font-family: "AvenirNextLTW01-Medium", Arial, sans-serif; + font-style: normal; + font-weight: 500; +} + +.lt-ie9 .intro-message { + font-weight: normal !important; +} + +.feature-header { + display: inline-block; + padding-bottom: 0.625em; + margin-bottom: 1.875em; + border-bottom: 4px solid #2cb34a; +} + +.feature-header_name { + display: inline-block; + margin: 0; + line-height: 1; +} + +.feature-header_docs { + display: inline-block; + vertical-align: top; + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; +} + +.feature-header_docs em, +.feature-header_docs i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .feature-header_docs em, +.lt-ie9 .feature-header_docs i { + font-style: normal !important; +} + +.feature-header_docs strong, +.feature-header_docs b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .feature-header_docs strong, +.lt-ie9 .feature-header_docs b { + font-weight: normal !important; +} + +.feature-header_name + .feature-header_docs { + margin-left: 1em; +} + +.color-demo { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; + height: 30px; +} + +.lt-ie8 .color-demo { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.color-demo__btn-bg { + background-color: #0072ce; +} + +.color-demo__btn-secondary-bg { + background-color: #75787b; +} + +.color-demo__btn-disabled-bg { + background-color: #e3e4e5; +} + +.sample-grid { + display: block; + position: relative; + margin-left: -15px; + margin-right: -15px; +} + +.sample-grid_col:before { + content: ""; + display: block; + width: 100%; + height: 1em; + background: #0072ce; +} + +.sample-grid_col-1 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 8.33333333%; +} + +.lt-ie8 .sample-grid_col-1 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-3 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 25%; +} + +.lt-ie8 .sample-grid_col-3 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-4 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 33.33333333%; +} + +.lt-ie8 .sample-grid_col-4 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.sample-grid_col-6 { + display: inline-block; + box-sizing: border-box; + border: solid transparent; + border-width: 0 15px; + margin-right: -0.25em; + vertical-align: top; + width: 50%; +} + +.lt-ie8 .sample-grid_col-6 { + display: inline; + margin-right: 0; + zoom: 1; + behavior: url('/static/vendor/box-sizing-polyfill/boxsizing.htc'); +} + +.typography-demo_item:after { + content: ""; + display: table; + clear: both; +} + +.lt-ie8 .typography-demo_item { + zoom: 1; +} + +.typography-demo_item-header { + float: left; + width: 12.5em; + margin-right: 30px; + text-align: right; +} + +.typography-demo .spec { + font-family: "AvenirNextLTW01-Regular", Arial, sans-serif; + font-style: normal; + font-weight: normal; + color: #75787B; + font-size: 0.875em; +} + +.typography-demo .spec em, +.typography-demo .spec i { + font-family: "AvenirNextLTW01-Italic", Arial, sans-serif; + font-style: italic; + font-weight: normal; +} + +.lt-ie9 .typography-demo .spec em, +.lt-ie9 .typography-demo .spec i { + font-style: normal !important; +} + +.typography-demo .spec strong, +.typography-demo .spec b { + font-family: "AvenirNextLTW01-Demi", Arial, sans-serif; + font-style: normal; + font-weight: bold; +} + +.lt-ie9 .typography-demo .spec strong, +.lt-ie9 .typography-demo .spec b { + font-weight: normal !important; +} \ No newline at end of file diff --git a/src/css/main.ie.min.css b/src/css/main.ie.min.css new file mode 100644 index 0000000..c49398f --- /dev/null +++ b/src/css/main.ie.min.css @@ -0,0 +1,6 @@ +/*! + * zzzzz - v0.1.0 + * http://www.consumerfinance.gov/ + * Licensed CC0 by Consumer Financial Protection Bureau + */ +@import url(//fast.fonts.net/t/1.css?apiType=css&projectid=44e8c964-4684-44c6-a6e3-3f3da8787b50);/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}/*! normalize-legacy-addon | MIT License | https://github.com/cfpb/normalize-legacy-addon */html{font-size:100%}button,html,input,select,textarea{font-family:sans-serif}h1{margin:.67em 0}h2{margin:.83em 0}h3{margin:1em 0}h4{margin:1.33em 0}h5{margin:1.67em 0}h6{margin:2.33em 0}p,pre{margin:1em 0}pre{white-space:pre;word-wrap:break-word}q{quotes:none}q:after,q:before{content:'';content:none}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ol,nav ul{list-style:none}img{-ms-interpolation-mode:bicubic}form{margin:0}legend{border:0;white-space:normal}button,input,select,textarea{vertical-align:baseline}.btn{display:inline-block;box-sizing:border-box;padding:.57142857em 1em;border:0;border-radius:.28571429em;margin:0;vertical-align:middle;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:.875em;line-height:normal;text-decoration:none;cursor:pointer;transition:background-color .1s;-webkit-appearance:none}.lt-ie9 .btn{font-weight:400!important}.btn,.btn:link,.btn:visited{background-color:#0072ce;color:#fff}.btn.hover,.btn:hover{background-color:#328ed8}.btn.focus,.btn:focus{background-color:#328ed8;outline:#0072ce dotted 1px;outline-offset:1px}.btn.active,.btn:active{background-color:#33578e}button.btn::-moz-focus-inner,input.btn::-moz-focus-inner{border:0}.btn+.btn{margin-left:.42857143em}.lt-ie8{background:url(null) no-repeat fixed}.lt-ie8 button.btn,.lt-ie8 input.btn{overflow:visible;padding-top:.45714286em;padding-bottom:.45714286em}.btn__secondary,.btn__secondary:link,.btn__secondary:visited{background-color:#75787b;color:#fff}.btn__secondary.hover,.btn__secondary:hover{background-color:#919395}.btn__secondary.focus,.btn__secondary:focus{background-color:#919395;outline-color:#75787b}.btn__secondary.active,.btn__secondary:active{background-color:#43484e}.btn__warning,.btn__warning:link,.btn__warning:visited{background-color:#d12124;color:#fff}.btn__warning.hover,.btn__warning:hover{background-color:#da6750}.btn__warning.focus,.btn__warning:focus{background-color:#da6750;outline-color:#d12124}.btn__warning.active,.btn__warning:active{background-color:#9c301b}.btn__disabled,.btn__disabled.active,.btn__disabled.focus,.btn__disabled.hover,.btn__disabled:active,.btn__disabled:focus,.btn__disabled:hover,.btn__disabled:link,.btn__disabled:visited{background-color:#e3e4e5;color:#75787b;cursor:default;cursor:not-allowed}.btn__disabled.focus,.btn__disabled:focus{outline-color:#e3e4e5}.btn__super{padding:.61111111em 1.61111111em;font-size:1.125em}.btn__super+.btn__super{margin-left:.33333333em}.lt-ie8 button.btn__super,.lt-ie8 input.btn__super{padding-top:.66666667em;padding-bottom:.66666667em}.btn_icon__left{padding:0 .75em 0 0;border-right:1px solid #fff;border-right:1px solid rgba(255,255,255,.4);margin:0 .5em 0 0}.btn__secondary .btn_icon__left,.btn__warning .btn_icon__left{border-right-color:#fff;border-right-color:rgba(255,255,255,.4)}.btn__disabled .btn_icon__left{border-right-color:#75787b;border-right-color:rgba(117,120,123,.4)}.btn_icon__right{padding:0 0 0 .75em;border-right:0;border-left:1px solid #fff;border-left:1px solid rgba(255,255,255,.4);margin:0 0 0 .5em}.btn__secondary .btn_icon__right,.btn__warning .btn_icon__right{border-left-color:#fff;border-left-color:rgba(255,255,255,.4)}.btn__disabled .btn_icon__right{border-left-color:#75787b;border-left-color:rgba(117,120,123,.4)}.btn__grouped{border-radius:0}.btn__grouped-first{border-top-right-radius:0;border-bottom-right-radius:0}.btn__grouped-last{border-top-left-radius:0;border-bottom-left-radius:0}.btn__grouped,.btn__grouped+.btn__grouped,.btn__grouped+.btn__grouped-last,.btn__grouped-first+.btn__grouped,.btn__grouped-first+.btn__grouped-last,.btn__grouped-last{margin-left:-.21428571em}.btn__grouped-first.btn__super+.btn__grouped-last.btn__super,.btn__grouped-first.btn__super+.btn__grouped.btn__super,.btn__grouped-last.btn__super,.btn__grouped.btn__super,.btn__grouped.btn__super+.btn__grouped-last.btn__super,.btn__grouped.btn__super+.btn__grouped.btn__super{margin-left:-.16666667em}.btn__compound-action,.btn__compound-action:link,.btn__compound-action:visited{background-color:#328ed8}.btn__compound-action.hover,.btn__compound-action:focus,.btn__compound-action:hover{background-color:#0072ce}.btn__compound-action.btn__secondary{background-color:#919395}.btn__compound-action.btn__secondary.hover,.btn__compound-action.btn__secondary:focus,.btn__compound-action.btn__secondary:hover{background-color:#75787b}.btn__compound-action.btn__warning{background-color:#da6750}.btn__compound-action.btn__warning.hover,.btn__compound-action.btn__warning:focus,.btn__compound-action.btn__warning:hover{background-color:#d12124}.btn__compound-action.btn__disabled,.btn__compound-action.btn__disabled.hover,.btn__compound-action.btn__disabled:focus,.btn__compound-action.btn__disabled:hover{background-color:#e3e4e5}.btn__compound-action.btn__super{padding-left:1.22222222em;padding-right:1.22222222em}.btn__link{padding:0;border-bottom:1px dotted #0072ce;border-radius:0;margin:.57142857em 0}.btn__link,.btn__link:link,.btn__link:visited{border-bottom-color:#0072ce;background-color:transparent;color:#0072ce}.btn__link.hover,.btn__link:hover{border-bottom:1px solid #328ed8;background-color:transparent;color:#328ed8}.btn__link.focus,.btn__link:focus{border-bottom-style:solid;background-color:transparent;outline:#0072ce dotted thin}.btn__link.active,.btn__link:active{border-bottom:1px solid #33578e;background-color:transparent;color:#33578e}.lt-ie8 button.btn__link,.lt-ie8 input.btn__link{padding:0}.btn__link.btn__secondary,.btn__link.btn__secondary:link,.btn__link.btn__secondary:visited{border-bottom-color:#75787b;background-color:transparent;color:#75787b}.btn__link.btn__secondary.hover,.btn__link.btn__secondary:hover{border-bottom-color:#919395;color:#919395}.btn__link.btn__secondary.focus,.btn__link.btn__secondary:focus{outline-color:#75787b}.btn__link.btn__secondary.active,.btn__link.btn__secondary:active{border-bottom-color:#43484e;color:#43484e}.btn__link.btn__warning,.btn__link.btn__warning:link,.btn__link.btn__warning:visited{border-bottom-color:#d12124;background-color:transparent;color:#d12124}.btn__link.btn__warning.hover,.btn__link.btn__warning:hover{border-bottom-color:#da6750;color:#da6750}.btn__link.btn__warning.focus,.btn__link.btn__warning:focus{outline-color:#d12124}.btn__link.btn__warning.active,.btn__link.btn__warning:active{border-bottom-color:#9c301b;color:#9c301b}.expandable{margin-bottom:1.875em}.expandable_target{padding:0;border:0;background-color:transparent;cursor:pointer}.expandable_target:focus{outline:#101820 dotted 1px;outline-offset:1px}.expandable_content:after{content:"";display:table;clear:both}.lt-ie8 .expandable_content{zoom:1}.expandable_label{color:#101820;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500}.lt-ie9 .expandable_label{font-weight:400!important}.expandable_link{color:#0072ce;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:.875em;line-height:1.57142857}.expandable_link em,.expandable_link i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .expandable_link em,.lt-ie9 .expandable_link i{font-style:normal!important}.expandable_link b,.expandable_link strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .expandable_link b,.lt-ie9 .expandable_link strong{font-weight:400!important}.expandable_cue-close__animated,.expandable_cue-open__animated{transition:.25s -webkit-transform;transition:.25s transform}.expandable_cue-close__animated{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}.expandable__expanded .expandable_cue-close__animated{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0)}.expandable__expanded .expandable_cue-open__animated{-webkit-transform:rotate(-180deg);-ms-transform:rotate(-180deg);transform:rotate(-180deg)}.expandable_header{display:block}.expandable_header:after{content:"";display:table;clear:both}.lt-ie8 .expandable_header{zoom:1}button.expandable_header{width:100%;text-align:left}.expandable_header__spaced{padding-bottom:.9375em}.expandable_header-left{float:left}.expandable_header-right{float:right}.expandable__padded{margin-bottom:1.875em;background:#f1f2f2}.expandable__padded.expandable__expanded,.expandable__padded:hover{background:#e3e4e5}.expandable__padded .expandable_header{padding:.625em 1em}.expandable__padded .expandable_content{margin:0 1em 1.375em}.expandable__padded .expandable_content:before{content:'';display:block;height:1px;margin-bottom:1em;background:#babbbd}.expandable-group{margin-bottom:1.875em}.expandable-group_header{padding:.35714286em 1.14285714em;border-bottom:1px solid #919395;background:#f1f2f2;color:#75787b;font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;margin-bottom:0}.lt-ie9 .expandable-group_header{font-weight:400!important}.expandable-group .expandable{border-bottom:1px solid #919395;margin-bottom:0;background:#fff}.expandable-group .expandable_label{margin-top:0;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222;margin-bottom:0}.lt-ie9 .expandable-group .expandable_label{font-weight:400!important}.expandable-group .expandable_content{margin-bottom:0}.form-label-header{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;margin-bottom:.71428571em}.lt-ie9 .form-label-header{font-weight:400!important}.input__super[type=email],.input__super[type=number],.input__super[type=search],.input__super[type=tel],.input__super[type=text],.input__super[type=url]{padding:.55555556em;font-size:1.125em}input[type=email].error,input[type=number].error,input[type=search].error,input[type=tel].error,input[type=text].error,input[type=url].error,select[multiple].error,textarea.error{border:1px solid #d12124;outline:#d12124 solid 1px}input[type=email].success,input[type=number].success,input[type=search].success,input[type=tel].success,input[type=text].success,input[type=url].success,select[multiple].success,textarea.success{border:1px solid #2cb34a;outline:#2cb34a solid 1px}.cf-form_input-icon{position:relative;top:.3em;margin-left:.2em;font-size:1.25em}.error+.cf-form_input-icon{color:#d12124}.success+.cf-form_input-icon{color:#2cb34a}.form-group+.form-group{margin-top:1.875em}.form-group_item+.form-group_item{margin-top:.9375em}.input-with-btn{display:block;position:relative;margin-left:-15px;margin-right:-15px}.input-with-btn_input{margin-bottom:.9375em;display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 0 0 15px;margin-right:-.25em;vertical-align:top;width:83.33333333%}.lt-ie8 .input-with-btn_input{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.input-with-btn_input input{box-sizing:border-box;width:100%}.input-with-btn_btn{margin-bottom:.9375em;display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:16.66666667%}.lt-ie8 .input-with-btn_btn{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.input-with-btn_btn .btn{box-sizing:border-box;width:100%}.input-with-btn_btn .btn__super{padding-left:.83333333em;padding-right:.83333333em}.btn-inside-input{position:relative}.btn-inside-input input[type=email],.btn-inside-input input[type=number],.btn-inside-input input[type=search],.btn-inside-input input[type=tel],.btn-inside-input input[type=text],.btn-inside-input input[type=url]{box-sizing:border-box;width:100%;padding-right:4.64285714em}.btn-inside-input input[type=email].input__super,.btn-inside-input input[type=number].input__super,.btn-inside-input input[type=search].input__super,.btn-inside-input input[type=tel].input__super,.btn-inside-input input[type=text].input__super,.btn-inside-input input[type=url].input__super{padding-right:5em}.btn-inside-input .btn{border-bottom-width:0!important;position:absolute;right:1.07142857em;top:0}.btn-inside-input .btn__super{right:.83333333em}@font-face{font-family:'CFPB Minicons';src:url(../fonts/cf-icons.eot);src:url(../fonts/cf-icons.eot?#iefix) format('embedded-opentype'),url(../fonts/cf-icons.woff) format('woff'),url(../fonts/cf-icons.ttf) format('truetype'),url(../fonts/cf-icons.svg) format('svg');font-weight:400;font-style:normal}.cf-icon{font-family:'CFPB Minicons';display:inline-block;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased}.cf-icon-left:before{content:"\e000"}.cf-icon-left-round:before{content:"\e001"}.cf-icon-right:before{content:"\e002"}.cf-icon-right-round:before{content:"\e003"}.cf-icon-up:before{content:"\e004"}.cf-icon-up-round:before{content:"\e005"}.cf-icon-down:before{content:"\e006"}.cf-icon-down-round:before{content:"\e007"}.cf-icon-arrow-left:before{content:"\e008"}.cf-icon-arrow-left-round:before{content:"\e009"}.cf-icon-arrow-right:before{content:"\e010"}.cf-icon-arrow-right-round:before{content:"\e011"}.cf-icon-arrow-up:before{content:"\e012"}.cf-icon-arrow-up-round:before{content:"\e013"}.cf-icon-arrow-down:before{content:"\e014"}.cf-icon-arrow-down-round:before{content:"\e015"}.cf-icon-approved:before{content:"\e100"}.cf-icon-approved-round:before{content:"\e101"}.cf-icon-error:before{content:"\e102"}.cf-icon-error-round:before{content:"\e103"}.cf-icon-help:before{content:"\e104"}.cf-icon-help-round:before{content:"\e105"}.cf-icon-delete:before{content:"\e106"}.cf-icon-delete-round:before{content:"\e107"}.cf-icon-plus:before{content:"\e108"}.cf-icon-plus-round:before{content:"\e109"}.cf-icon-minus:before{content:"\e110"}.cf-icon-minus-round:before{content:"\e111"}.cf-icon-update:before{content:"\e112"}.cf-icon-update-round:before{content:"\e113"}.cf-icon-youtube:before{content:"\e200"}.cf-icon-youtube-square:before{content:"\e201"}.cf-icon-linkedin:before{content:"\e202"}.cf-icon-linkedin-square:before{content:"\e203"}.cf-icon-facebook:before{content:"\e204"}.cf-icon-facebook-square:before{content:"\e205"}.cf-icon-flickr:before{content:"\e206"}.cf-icon-flickr-square:before{content:"\e207"}.cf-icon-twitter:before{content:"\e208"}.cf-icon-twitter-square:before{content:"\e209"}.cf-icon-github:before{content:"\e210"}.cf-icon-github-square:before{content:"\e211"}.cf-icon-email-social:before{content:"\e212"}.cf-icon-email-social-square:before{content:"\e213"}.cf-icon-web:before{content:"\e300"}.cf-icon-web-round:before{content:"\e301"}.cf-icon-email:before{content:"\e302"}.cf-icon-email-round:before{content:"\e303"}.cf-icon-mail:before{content:"\e304"}.cf-icon-mail-round:before{content:"\e305"}.cf-icon-phone:before{content:"\e306"}.cf-icon-phone-round:before{content:"\e307"}.cf-icon-technology:before{content:"\e308"}.cf-icon-technology-round:before{content:"\e309"}.cf-icon-fax:before{content:"\e310"}.cf-icon-fax-round:before{content:"\e311"}.cf-icon-document:before{content:"\e400"}.cf-icon-document-round:before{content:"\e401"}.cf-icon-pdf:before{content:"\e402"}.cf-icon-pdf-round:before{content:"\e403"}.cf-icon-upload:before{content:"\e404"}.cf-icon-upload-round:before{content:"\e405"}.cf-icon-download:before{content:"\e406"}.cf-icon-download-round:before{content:"\e407"}.cf-icon-copy:before{content:"\e408"}.cf-icon-copy-round:before{content:"\e409"}.cf-icon-edit:before{content:"\e410"}.cf-icon-edit-round:before{content:"\e411"}.cf-icon-attach:before{content:"\e412"}.cf-icon-attach-round:before{content:"\e413"}.cf-icon-print:before{content:"\e414"}.cf-icon-print-round:before{content:"\e415"}.cf-icon-save:before{content:"\e416"}.cf-icon-save-round:before{content:"\e417"}.cf-icon-appendix:before{content:"\e418"}.cf-icon-appendix-round:before{content:"\e419"}.cf-icon-supplement:before{content:"\e420"}.cf-icon-supplement-round:before{content:"\e421"}.cf-icon-rss:before{content:"\e422"}.cf-icon-rss-round:before{content:"\e423"}.cf-icon-bank-account:before{content:"\e500"}.cf-icon-bank-account-round:before{content:"\e501"}.cf-icon-credit-card:before{content:"\e502"}.cf-icon-credit-card-round:before{content:"\e503"}.cf-icon-loan:before{content:"\e504"}.cf-icon-loan-round:before{content:"\e505"}.cf-icon-money-transfer:before{content:"\e506"}.cf-icon-money-transfer-round:before{content:"\e507"}.cf-icon-mortgage:before{content:"\e508"}.cf-icon-mortgage-round:before{content:"\e509"}.cf-icon-debt-collection:before{content:"\e510"}.cf-icon-debt-collection-round:before{content:"\e511"}.cf-icon-credit-report:before{content:"\e512"}.cf-icon-credit-report-round:before{content:"\e513"}.cf-icon-money:before{content:"\e514"}.cf-icon-money-round:before{content:"\e515"}.cf-icon-quick-cash:before{content:"\e516"}.cf-icon-quick-cash-round:before{content:"\e517"}.cf-icon-contract:before{content:"\e518"}.cf-icon-contract-round:before{content:"\e519"}.cf-icon-complaint:before{content:"\e520"}.cf-icon-complaint-round:before{content:"\e521"}.cf-icon-getting-credit-card:before{content:"\e522"}.cf-icon-getting-credit-card-round:before{content:"\e523"}.cf-icon-buying-car:before{content:"\e524"}.cf-icon-buying-car-round:before{content:"\e525"}.cf-icon-paying-college:before{content:"\e526"}.cf-icon-paying-college-round:before{content:"\e527"}.cf-icon-owning-home:before{content:"\e528"}.cf-icon-owning-home-round:before{content:"\e529"}.cf-icon-debt:before{content:"\e530"}.cf-icon-debt-round:before{content:"\e531"}.cf-icon-building-credit:before{content:"\e532"}.cf-icon-building-credit-round:before{content:"\e533"}.cf-icon-prepaid-cards:before{content:"\e534"}.cf-icon-prepaid-cards-round:before{content:"\e535"}.cf-icon-payday-loan:before{content:"\e536"}.cf-icon-payday-loan-round:before{content:"\e537"}.cf-icon-retirement:before{content:"\e538"}.cf-icon-retirement-round:before{content:"\e539"}.cf-icon-user:before{content:"\e600"}.cf-icon-user-round:before{content:"\e601"}.cf-icon-wifi:before{content:"\e602"}.cf-icon-wifi-round:before{content:"\e603"}.cf-icon-search:before{content:"\e604"}.cf-icon-search-round:before{content:"\e605"}.cf-icon-share:before{content:"\e606"}.cf-icon-share-round:before{content:"\e607"}.cf-icon-link:before{content:"\e608"}.cf-icon-link-round:before{content:"\e609"}.cf-icon-external-link:before{content:"\e610"}.cf-icon-external-link-round:before{content:"\e611"}.cf-icon-audio-mute:before{content:"\e612"}.cf-icon-audio-mute-round:before{content:"\e616"}.cf-icon-audio-low:before{content:"\e613"}.cf-icon-audio-low-round:before{content:"\e617"}.cf-icon-audio-medium:before{content:"\e614"}.cf-icon-audio-medium-round:before{content:"\e618"}.cf-icon-audio-max:before{content:"\e615"}.cf-icon-audio-max-round:before{content:"\e619"}.cf-icon-favorite:before{content:"\e620"}.cf-icon-favorite-round:before{content:"\e621"}.cf-icon-unfavorite:before{content:"\e622"}.cf-icon-unfavorite-round:before{content:"\e623"}.cf-icon-bookmark:before{content:"\e624"}.cf-icon-bookmark-round:before{content:"\e625"}.cf-icon-unbookmark:before{content:"\e626"}.cf-icon-unbookmark-round:before{content:"\e627"}.cf-icon-settings:before{content:"\e628"}.cf-icon-settings-round:before{content:"\e629"}.cf-icon-menu:before{content:"\e630"}.cf-icon-menu-round:before{content:"\e631"}.cf-icon-lock:before{content:"\e632"}.cf-icon-lock-round:before{content:"\e633"}.cf-icon-unlock:before{content:"\e634"}.cf-icon-unlock-round:before{content:"\e635"}.cf-icon-clock:before{content:"\e636"}.cf-icon-clock-round:before{content:"\e637"}.cf-icon-chart:before{content:"\e638"}.cf-icon-chart-round:before{content:"\e639"}.cf-icon-play:before{content:"\e640"}.cf-icon-play-round:before{content:"\e641"}.cf-icon-newspaper:before{content:"\e700"}.cf-icon-newspaper-round:before{content:"\e701"}.cf-icon-microphone:before{content:"\e702"}.cf-icon-microphone-round:before{content:"\e703"}.cf-icon-bullhorn:before{content:"\e704"}.cf-icon-bullhorn-round:before{content:"\e705"}.cf-icon-double-quote:before{content:"\e708"}.cf-icon-double-quote-round:before{content:"\e709"}.cf-icon-speech-bubble:before{content:"\e710"}.cf-icon-speech-bubble-round:before{content:"\e711"}.cf-icon-information:before{content:"\e712"}.cf-icon-information-round:before{content:"\e713"}.cf-icon-lightbulb:before{content:"\e714"}.cf-icon-lightbulb-round:before{content:"\e715"}.cf-icon-dialogue:before{content:"\e716"}.cf-icon-dialogue-round:before{content:"\e717"}.cf-icon-date:before{content:"\e718"}.cf-icon-date-round:before{content:"\e719"}.content-l{display:block;position:relative;margin-left:-15px;margin-right:-15px}.content-l__sidebar .content-l_col.content-l_col-1-3{display:block;width:100%}.content-l__sidebar .content-l_col.content-l_col-1-3.content-l_col__before-divider{margin-top:3.75em;border-left-width:15px}.content-l__sidebar .content-l_col.content-l_col-1-3.content-l_col__before-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-1-3.content-l_col__before-divider{border-left-width:30px}.content-l__sidebar .content-l_col.content-l_col-1-3+.content-l_col.content-l_col-1-3{margin-top:1.875em}.content-l__sidebar .content-l_col.content-l_col-2-3{display:block;width:100%}.content-l__sidebar .content-l_col.content-l_col-2-3.content-l_col__before-divider{margin-top:3.75em;border-left-width:15px}.content-l__sidebar .content-l_col.content-l_col-2-3.content-l_col__before-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-2-3.content-l_col__before-divider{border-left-width:30px}.content-l__sidebar .content-l_col.content-l_col-1-3+.content-l_col.content-l_col-2-3,.content-l__sidebar .content-l_col.content-l_col-2-3+.content-l_col.content-l_col-1-3,.content-l__sidebar .content-l_col.content-l_col-2-3+.content-l_col.content-l_col-2-3{margin-top:1.875em}.content-l__sidebar .content-l_col.content-l_col-3-8{display:block;width:100%}.content-l__sidebar .content-l_col.content-l_col-3-8.content-l_col__before-divider{margin-top:3.75em;border-left-width:15px}.content-l__sidebar .content-l_col.content-l_col-3-8.content-l_col__before-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-3-8.content-l_col__before-divider{border-left-width:30px}.content-l__sidebar .content-l_col.content-l_col-3-8+.content-l_col.content-l_col-3-8{margin-top:1.875em}.content-l__sidebar .content-l_col.content-l_col-5-8{display:block;width:100%}.content-l__sidebar .content-l_col.content-l_col-5-8.content-l_col__before-divider{margin-top:3.75em;border-left-width:15px}.content-l__sidebar .content-l_col.content-l_col-5-8.content-l_col__before-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-5-8.content-l_col__before-divider{border-left-width:30px}.content-l__sidebar .content-l_col.content-l_col-3-8+.content-l_col.content-l_col-5-8,.content-l__sidebar .content-l_col.content-l_col-5-8+.content-l_col.content-l_col-3-8,.content-l__sidebar .content-l_col.content-l_col-5-8+.content-l_col.content-l_col-5-8{margin-top:1.875em}.content-l__sidebar .content-l_col.content-l_col-1-2{display:block;width:100%}.content-l__sidebar .content-l_col.content-l_col-1-2.content-l_col__before-divider{margin-top:3.75em;border-left-width:15px}.content-l__sidebar .content-l_col.content-l_col-1-2.content-l_col__before-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.content-l__sidebar.content-l__large-gutters .content-l_col.content-l_col-1-2.content-l_col__before-divider{border-left-width:30px}.content-l__sidebar .content-l_col.content-l_col-1-2+.content-l_col.content-l_col-1-2{margin-top:1.875em}.content-l__large-gutters{margin-left:-30px;margin-right:-30px}.content-l__large-gutters .content-l_col{border-left-width:30px;border-right-width:30px}.content-l_col+.content-l_col{margin-top:1.875em}.content-l_col.content-l_col-1-2+.content-l_col.content-l_col-1-2,.content-l_col.content-l_col-1-3+.content-l_col.content-l_col-1-3,.content-l_col.content-l_col-3-8+.content-l_col.content-l_col-3-8,.content-l_col.content-l_col-3-8+.content-l_col.content-l_col-5-8,.content-l_col.content-l_col-5-8+.content-l_col.content-l_col-3-8{margin-top:0}.content-l_col-1{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-1{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col-1-2{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .content-l_col-1-2{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col-1-3{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%}.lt-ie8 .content-l_col-1-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col-2-3{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%}.lt-ie8 .content-l_col-2-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col-3-8{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:37.5%}.lt-ie8 .content-l_col-3-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col-5-8{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:62.5%}.lt-ie8 .content-l_col-5-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content-l_col__before-divider.content-l_col-1-2{border-left-width:30px}.content-l_col__before-divider.content-l_col-1-2:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}.content-l_col__before-divider.content-l_col-1-3{border-left-width:30px}.content-l_col__before-divider.content-l_col-1-3:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}.content_bar{height:10px;background:#2cb34a}.content_line{height:1px;background:#babbbd}.content_intro,.content_main,.content_sidebar{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content_intro,.lt-ie8 .content_main,.lt-ie8 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content_intro,.content_main,.content_sidebar{padding:3.75em 0}.content_intro{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content_intro{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__1-3 .content_sidebar{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:25%;padding-right:1.875em}.lt-ie8 .content__1-3 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__1-3 .content_main{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:75%;position:relative}.lt-ie8 .content__1-3 .content_main{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__1-3 .content_main:after{content:'';border-left:1px solid #babbbd;position:absolute;top:3.75em;bottom:0;left:-1.875em}.content__2-1 .content_main{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%}.lt-ie8 .content__2-1 .content_main{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__2-1 .content_main:after{right:-1.875em}.content__2-1 .content_sidebar{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%;padding-left:1.875em}.lt-ie8 .content__2-1 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__flush-bottom{padding-bottom:0}.block{margin-top:3.75em;margin-bottom:3.75em}.block__border-top{border-top:1px solid #babbbd}.block__border-bottom{border-bottom:1px solid #babbbd}.block__flush-top{margin-top:0!important}.block__flush-bottom{margin-bottom:0!important}.block__flush-sides{margin-right:-30px;margin-left:-30px}.block__bg{background:#f1f2f2;padding:2.8125em 1.875em}.block__padded-top{padding-top:1.875em;margin-top:1.875em}.block__padded-bottom{padding-bottom:1.875em;margin-bottom:1.875em}.block__sub{margin-top:1.875em;margin-bottom:1.875em}.content-l_col.block,.content-l_col.block__sub{margin-top:0}.content__bleedbar .content_main:after{content:none}.content__bleedbar{overflow:hidden}.content__bleedbar .content_sidebar{padding:3.75em 0 .9375em 1.875em;margin-left:0;position:relative;z-index:1;background:0 0}.lt-ie8 .content__bleedbar .content_sidebar{padding-right:30px;background:#f1f2f2}.content__bleedbar .content_wrapper:after{content:'';display:block;width:9999px;border-left:1px solid #babbbd;height:100%;position:absolute;top:0;z-index:0;margin-left:10px;background:#f1f2f2}.content__bleedbar.content__2-1 .content_wrapper:after{left:66.666666667%}.content__bleedbar.content__3-1 .content_wrapper:after{left:75%}.content_wrapper,.wrapper{max-width:1170px;padding:0 15px;margin:0 auto;position:relative;clear:both}.content_wrapper__match-content,.wrapper__match-content{padding-left:30px;padding-right:30px;max-width:1140px}.lt-ie9 .content_wrapper,.lt-ie9 .wrapper{max-width:960px}.lt-ie9 body{min-width:800px}.grid_column__top-divider{margin-top:3.75em;border-left-width:15px}.grid_column__top-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd;position:static;width:100%;margin-left:auto!important}.grid_column__left-divider{border-left-width:30px}.grid_column__left-divider:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}.pagination{display:block;position:relative}.pagination_next{position:absolute;top:0;right:0}.pagination_form{display:block;padding:.3125em .3125em .375em;background:#e3e4e5;color:#75787b;text-align:center}.pagination_label{display:inline-block;margin:0;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:1em;vertical-align:middle}.lt-ie8 .pagination_label{display:inline}.lt-ie9 .pagination_label{font-weight:400!important}.pagination_current-page,input[type=number].pagination_current-page,input[type=text].pagination_current-page{display:inline-block;width:2.625em;margin:0 .25em;font-size:1em;font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;text-align:right;vertical-align:middle}.lt-ie8 .pagination_current-page,.lt-ie8 input[type=number].pagination_current-page,.lt-ie8 input[type=text].pagination_current-page{display:inline}.lt-ie9 .pagination_current-page,.lt-ie9 input[type=number].pagination_current-page,.lt-ie9 input[type=text].pagination_current-page{font-weight:400!important}.lt-ie8 .pagination_current-page,.lt-ie8 input[type=number].pagination_current-page,.lt-ie8 input[type=text].pagination_current-page{margin:0 4px}.pagination_submit.btn{display:inline-block;margin:0 0 0 .875em;font-size:1em;vertical-align:middle}.lt-ie8 .pagination_submit.btn{display:inline;padding-left:.875em;margin:0;border:none;text-decoration:underline}.pagination_form{margin:0;border-radius:.25em}.pagination_prev{position:absolute;top:0;left:0}.pagination_prev,.pagination_prev:link,.pagination_prev:visited{border-top-right-radius:0;border-bottom-right-radius:0}.pagination_next,.pagination_next:link,.pagination_next:visited{border-top-left-radius:0;border-bottom-left-radius:0}.pull-quote_body{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:1.375em;line-height:1.27272727;margin-bottom:.54545455em;color:#101820}.pull-quote_body em,.pull-quote_body i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .pull-quote_body em,.lt-ie9 .pull-quote_body i{font-style:normal!important}.pull-quote_body b,.pull-quote_body strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .pull-quote_body b,.lt-ie9 .pull-quote_body strong{font-weight:400!important}.pull-quote_citation{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;margin-bottom:.35714286em;font-size:.875em;line-height:1.57142857;color:#75787b}.lt-ie9 .pull-quote_citation{font-weight:400!important}.pull-quote__large .pull-quote_body{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:1.625em;line-height:1.26923077;margin-bottom:.69230769em}.pull-quote__large .pull-quote_body em,.pull-quote__large .pull-quote_body i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .pull-quote__large .pull-quote_body em,.lt-ie9 .pull-quote__large .pull-quote_body i{font-style:normal!important}.pull-quote__large .pull-quote_body b,.pull-quote__large .pull-quote_body strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .pull-quote__large .pull-quote_body b,.lt-ie9 .pull-quote__large .pull-quote_body strong{font-weight:400!important}.micro-copy{color:#75787b;font-size:.875em;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.micro-copy em,.micro-copy i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .micro-copy em,.lt-ie9 .micro-copy i{font-style:normal!important}.micro-copy b,.micro-copy strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .micro-copy b,.lt-ie9 .micro-copy strong{font-weight:400!important}.micro-copy__large{font-size:1em}.short-desc{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.short-desc em,.short-desc i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .short-desc em,.lt-ie9 .short-desc i{font-style:normal!important}.short-desc b,.short-desc strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .short-desc b,.lt-ie9 .short-desc strong{font-weight:400!important}.short-desc__large{font-size:1.125em}.date{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;margin-bottom:.35714286em;font-size:.875em;line-height:1.57142857;color:#75787b;white-space:nowrap}.lt-ie9 .date{font-weight:400!important}.category-slug{margin-top:0;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222;display:inline-block;margin-bottom:.44444444em;color:#101820}.lt-ie9 .category-slug{font-weight:400!important}a.category-slug{color:#101820;border-color:#101820}a.category-slug.visited,a.category-slug:visited{border-color:#101820;color:#101820}a.category-slug.focus,a.category-slug.hover,a.category-slug:focus,a.category-slug:hover{border-color:#7fb8e6;color:#7fb8e6}a.category-slug.active,a.category-slug:active{border-color:#101820;color:#101820}.category-slug_icon{margin-right:.11111111em}.header-slug{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;margin-bottom:1.21428571em;border-top:1px solid #e3e4e5}.lt-ie9 .header-slug{font-weight:400!important}.header-slug_inner{display:inline-block;padding-top:.28571429em;margin-top:-3px;border-top:5px solid #2cb34a}.padded-header{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;padding:.57142857em .71428571em;margin-bottom:0;border-bottom:1px solid #babbbd;background:#f1f2f2;color:#43484e}.lt-ie9 .padded-header{font-weight:400!important}.fancy-slug{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:.875em;position:relative;height:1.14285714em;padding:0 1.21428571em;margin-top:1.14285714em;margin-bottom:.57142857em;border-top:1px solid #babbbd;line-height:1;text-align:center}.lt-ie9 .fancy-slug{font-weight:400!important}.fancy-slug_text{display:inline-block;position:relative;top:-1.14285714em;padding:.57142857em 1.42857143em;border:1px solid #babbbd;background:#fff}.fancy-slug_ribbon-left,.fancy-slug_ribbon-right{display:block;position:absolute;top:-1px;width:1.21428571em;height:100%;border-top:1px solid #babbbd;border-bottom:1px solid #babbbd}.lt-ie9 .fancy-slug_ribbon-left,.lt-ie9 .fancy-slug_ribbon-right{display:none}.fancy-slug_ribbon-left:after,.fancy-slug_ribbon-left:before,.fancy-slug_ribbon-right:after,.fancy-slug_ribbon-right:before{display:block;content:"";position:absolute;z-index:3;width:1.21428571em;height:50%;background:#fff;border:0 solid #babbbd}.fancy-slug_ribbon-left{left:-1.21428571em}.fancy-slug_ribbon-left:before{top:0;border-left-width:1px;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;-webkit-transform:skewX(33deg);-ms-transform:skewX(33deg);transform:skewX(33deg)}.fancy-slug_ribbon-left:after{bottom:0;border-left-width:1px;-webkit-transform-origin:0 100%;-ms-transform-origin:0 100%;transform-origin:0 100%;-webkit-transform:skewX(-33deg);-ms-transform:skewX(-33deg);transform:skewX(-33deg)}.fancy-slug_ribbon-right{right:-1.21428571em}.fancy-slug_ribbon-right:before{top:0;right:0;border-right-width:1px;-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0;-webkit-transform:skewX(-33deg);-ms-transform:skewX(-33deg);transform:skewX(-33deg)}.fancy-slug_ribbon-right:after{right:0;bottom:0;border-right-width:1px;-webkit-transform-origin:100% 100%;-ms-transform-origin:100% 100%;transform-origin:100% 100%;-webkit-transform:skewX(33deg);-ms-transform:skewX(33deg);transform:skewX(33deg)}.meta-header{padding-bottom:.5em;margin-bottom:.625em;border-bottom:1px solid #babbbd}.meta-header_left{margin-bottom:0}.meta-header_right{margin-bottom:0;float:right;display:inline-block}.icon-link{border-bottom-width:0;position:relative}.icon-link_text{border-bottom-width:1px;border-bottom-style:inherit}.icon-link:after,.icon-link:before{font-family:'CFPB Minicons';display:inline-block;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;margin-right:1px;margin-left:1px}.icon-link__download.icon-link__before:before,.icon-link__download:after{content:"\e406"}.icon-link__email.icon-link__before:before,.icon-link__email:after{content:"\e302"}.icon-link__external-link.icon-link__before:before,.icon-link__external-link:after{content:"\e610"}.icon-link__fax.icon-link__before:before,.icon-link__fax:after{content:"\e310"}.icon-link__left.icon-link__before:before,.icon-link__left:after{content:"\e000"}.icon-link__mail.icon-link__before:before,.icon-link__mail:after{content:"\e304"}.icon-link__pdf.icon-link__before:before,.icon-link__pdf:after{content:"\e402"}.icon-link__phone.icon-link__before:before,.icon-link__phone:after{content:"\e306"}.icon-link__right.icon-link__before:before,.icon-link__right:after{content:"\e002"}.icon-link__before:after{content:''}.icon-link__no-wrap{white-space:nowrap}.styled-link{border-bottom-width:1px;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:1em}.lt-ie9 .styled-link{font-weight:400!important}.jump-link{font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:1em;border-bottom-width:0;position:relative}.lt-ie9 .jump-link{font-weight:400!important}.jump-link_text{border-bottom-width:1px;border-bottom-style:inherit}.jump-link:after,.jump-link:before{font-family:'CFPB Minicons';display:inline-block;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;margin-right:1px;margin-left:1px}.jump-link__download.jump-link__before:before,.jump-link__download:after{content:"\e406"}.jump-link__email.jump-link__before:before,.jump-link__email:after{content:"\e302"}.jump-link__external-link.jump-link__before:before,.jump-link__external-link:after{content:"\e610"}.jump-link__fax.jump-link__before:before,.jump-link__fax:after{content:"\e310"}.jump-link__left.jump-link__before:before,.jump-link__left:after{content:"\e000"}.jump-link__mail.jump-link__before:before,.jump-link__mail:after{content:"\e304"}.jump-link__pdf.jump-link__before:before,.jump-link__pdf:after{content:"\e402"}.jump-link__phone.jump-link__before:before,.jump-link__phone:after{content:"\e306"}.jump-link__right.jump-link__before:before,.jump-link__right:after{content:"\e002"}.jump-link__before:after{content:''}.jump-link__no-wrap{white-space:nowrap}.jump-link__large{font-size:1.125em}.block-link{box-sizing:border-box;display:block;padding:.625em 1.25em .625em 0;border:dotted #fff;border-width:1px 0;margin-right:0;width:100%;text-align:left}.list__unstyled{padding-left:0;list-style-type:none}.list__unstyled .list_item{margin-left:0}.list__spaced .list_item+.list_item,.list_item__spaced{margin-top:1.5em}.list__horizontal{padding-left:0}.list__horizontal .list_item{display:inline-block}.lt-ie8 .list__horizontal .list_item{display:inline}.list__horizontal .list_item{margin-right:.25em;margin-left:0}.list__icons{padding-left:0;list-style-type:none}.list__icons .list_item{margin-left:0}.list__icons .list_icon{width:1.5em;text-align:center}.list__branded .list_item,.list__branded li{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;list-style-type:none;position:relative}.list__branded .list_item em,.list__branded .list_item i,.list__branded li em,.list__branded li i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .list__branded .list_item em,.lt-ie9 .list__branded .list_item i,.lt-ie9 .list__branded li em,.lt-ie9 .list__branded li i{font-style:normal!important}.list__branded .list_item b,.list__branded .list_item strong,.list__branded li b,.list__branded li strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .list__branded .list_item b,.lt-ie9 .list__branded .list_item strong,.lt-ie9 .list__branded li b,.lt-ie9 .list__branded li strong{font-weight:400!important}.list__branded .list_item:before,.list__branded li:before{content:"\25AA";font-family:inherit;font-size:1.375em;color:#2cb34a;line-height:1;position:absolute;left:-.86363636em}.no-js .u-js-only{display:none!important}.u-clearfix:after{content:"";display:table;clear:both}.lt-ie8 .u-clearfix{zoom:1}.u-visually-hidden{position:absolute;overflow:hidden;clip:rect(0 0 0 0);height:1px;width:1px;margin:-1px;padding:0;border:0}.u-inline-block{display:inline-block}.lt-ie8 .u-inline-block{display:inline}.u-right{float:right}.u-break-word{word-break:break-all}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container_inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container__4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w25pct{width:25%}.u-w66pct{width:66.66666667%}.u-w33pct{width:33.33333333%}.u-show-on-mobile{display:none}.u-small-text,small{font-size:.875em}@font-face{font-family:AvenirNextLTW01-Regular;src:url(//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:400}@font-face{font-family:AvenirNextLTW01-Regular;src:url(//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/1e9892c0-6927-4412-9874-1b82801ba47a.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/46cf1067-688d-4aab-b0f7-bd942af6efd8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/52a192b1-bea5-4b48-879f-107f009b666f.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#52a192b1-bea5-4b48-879f-107f009b666f) format("svg");font-style:normal;font-weight:400}@font-face{font-family:AvenirNextLTW01-Italic;src:url(//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:italic;font-weight:400}@font-face{font-family:AvenirNextLTW01-Italic;src:url(//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/18839597-afa8-4f0b-9abb-4a30262d0da8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585) format("svg");font-style:italic;font-weight:400}@font-face{font-family:AvenirNextLTW01-Medium;src:url(//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:500}@font-face{font-family:AvenirNextLTW01-Medium;src:url(//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/f26faddb-86cc-4477-a253-1e1287684336.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/63a74598-733c-4d0c-bd91-b01bffcd6e69.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/a89d6ad1-a04f-4a8f-b140-e55478dbea80.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#a89d6ad1-a04f-4a8f-b140-e55478dbea80) format("svg");font-style:normal;font-weight:500}@font-face{font-family:AvenirNextLTW01-Demi;src:url(//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:700}@font-face{font-family:AvenirNextLTW01-Demi;src:url(//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/a0f4c2f9-8a42-4786-ad00-fce42b57b148.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/99affa9a-a5e9-4559-bd07-20cf0071852d.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#99affa9a-a5e9-4559-bd07-20cf0071852d) format("svg");font-style:normal;font-weight:700}body{color:#101820;font-family:Georgia,"Times New Roman",serif;font-size:100%;line-height:1.375}.h1,.h2,.h3,h1,h2,h3{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.h1 em,.h1 i,.h2 em,.h2 i,.h3 em,.h3 i,h1 em,h1 i,h2 em,h2 i,h3 em,h3 i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .h1 em,.lt-ie9 .h1 i,.lt-ie9 .h2 em,.lt-ie9 .h2 i,.lt-ie9 .h3 em,.lt-ie9 .h3 i,.lt-ie9 h1 em,.lt-ie9 h1 i,.lt-ie9 h2 em,.lt-ie9 h2 i,.lt-ie9 h3 em,.lt-ie9 h3 i{font-style:normal!important}.h1 b,.h1 strong,.h2 b,.h2 strong,.h3 b,.h3 strong,h1 b,h1 strong,h2 b,h2 strong,h3 b,h3 strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .h1 b,.lt-ie9 .h1 strong,.lt-ie9 .h2 b,.lt-ie9 .h2 strong,.lt-ie9 .h3 b,.lt-ie9 .h3 strong,.lt-ie9 h1 b,.lt-ie9 h1 strong,.lt-ie9 h2 b,.lt-ie9 h2 strong,.lt-ie9 h3 b,.lt-ie9 h3 strong{font-weight:400!important}.h1,h1{margin-top:0;margin-bottom:.47058824em;font-size:2.125em;line-height:1.29411765}.h2,h2{margin-top:0;margin-bottom:.73076923em;font-size:1.625em;line-height:1.26923077}.h3,h3{margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}.h4,h4{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .h4,.lt-ie9 h4{font-weight:400!important}.h5,.h6,h5,h6{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase}.lt-ie9 .h5,.lt-ie9 .h6,.lt-ie9 h5,.lt-ie9 h6{font-weight:400!important}.h5,h5{margin-top:0;margin-bottom:.35714286em;font-size:.875em;line-height:1.57142857}.h6,h6{margin-top:0;margin-bottom:.41666667em;font-size:.75em;line-height:1.83333333}.superheader{margin-bottom:.1875em;font-size:3em;font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;line-height:1.25}.lt-ie9 .superheader{font-weight:400!important}dl,figure,ol,p,table,ul{margin-top:0;margin-bottom:1.25em}a{border-width:0;border-style:dotted;border-color:#0072ce;color:#0072ce;text-decoration:none}a.visited,a:visited{border-color:#005e5d;color:#005e5d}a.hover,a:hover{border-style:solid;border-color:#7fb8e6;color:#7fb8e6}a.focus,a:focus{border-style:solid;outline:dotted thin}a.active,a:active{border-style:solid;border-color:#002d72;color:#002d72}dd a,li a,p a{border-bottom-width:1px}nav a{border-bottom-width:0}ul{list-style:square}table{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}table em,table i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 table em,.lt-ie9 table i{font-style:normal!important}table b,table strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 table b,.lt-ie9 table strong{font-weight:400!important}td,th{padding:.75em .9375em;background:#f8f8f8}thead td,thead th{color:#fff;background:#43484e}tbody>tr:nth-child(odd)>td,tbody>tr:nth-child(odd)>th{background:#f1f2f2}.compact-table td,.compact-table th{padding:.4375em .625em}th{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;text-align:left}.lt-ie9 th{font-weight:400!important}blockquote{margin:1.75em 2.5em}label{display:block;margin-bottom:.3125em;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}label em,label i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 label em,.lt-ie9 label i{font-style:normal!important}label b,label strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 label b,.lt-ie9 label strong{font-weight:400!important}label input[type=checkbox],label input[type=radio]{margin-right:.375em}input[type=email],input[type=number],input[type=search],input[type=tel],input[type=text],input[type=url],select[multiple],textarea{display:inline-block;margin:0;padding:.375em;font-family:Arial,sans-serif;font-size:1em;background:#fff;border:1px solid #75787b;border-radius:0;vertical-align:top;-webkit-appearance:none;-webkit-user-modify:read-write-plaintext-only}::-webkit-search-decoration{-webkit-appearance:none}input[type=email].focus,input[type=email]:focus,input[type=number].focus,input[type=number]:focus,input[type=search].focus,input[type=search]:focus,input[type=tel].focus,input[type=tel]:focus,input[type=text].focus,input[type=text]:focus,input[type=url].focus,input[type=url]:focus,select[multiple].focus,select[multiple]:focus,textarea.focus,textarea:focus{border:1px solid #0072ce;outline:#0072ce solid 1px;outline-offset:0;box-shadow:none}::-webkit-input-placeholder{color:#75787b}::-moz-placeholder{color:#75787b}:-ms-input-placeholder{color:#75787b}img{max-width:100%}figure{margin-left:0;margin-right:0}figure img{vertical-align:middle}.figure__bordered img{border:1px solid #babbbd}.intro-message{padding:1em;background:#f1f2f2;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500}.lt-ie9 .intro-message{font-weight:400!important}.feature-header{display:inline-block;padding-bottom:.625em;margin-bottom:1.875em;border-bottom:4px solid #2cb34a}.feature-header_name{display:inline-block;margin:0;line-height:1}.feature-header_docs{display:inline-block;vertical-align:top;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.feature-header_docs em,.feature-header_docs i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .feature-header_docs em,.lt-ie9 .feature-header_docs i{font-style:normal!important}.feature-header_docs b,.feature-header_docs strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .feature-header_docs b,.lt-ie9 .feature-header_docs strong{font-weight:400!important}.feature-header_name+.feature-header_docs{margin-left:1em}.color-demo{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%;height:30px}.lt-ie8 .color-demo{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.color-demo__btn-bg{background-color:#0072ce}.color-demo__btn-secondary-bg{background-color:#75787b}.color-demo__btn-disabled-bg{background-color:#e3e4e5}.sample-grid{display:block;position:relative;margin-left:-15px;margin-right:-15px}.sample-grid_col:before{content:"";display:block;width:100%;height:1em;background:#0072ce}.sample-grid_col-1{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:8.33333333%}.lt-ie8 .sample-grid_col-1{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.sample-grid_col-3{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:25%}.lt-ie8 .sample-grid_col-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.sample-grid_col-4{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%}.lt-ie8 .sample-grid_col-4{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.sample-grid_col-6{display:inline-block;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .sample-grid_col-6{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.typography-demo_item:after{content:"";display:table;clear:both}.lt-ie8 .typography-demo_item{zoom:1}.typography-demo_item-header{float:left;width:12.5em;margin-right:30px;text-align:right}.typography-demo .spec{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;color:#75787B;font-size:.875em}.typography-demo .spec em,.typography-demo .spec i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .typography-demo .spec em,.lt-ie9 .typography-demo .spec i{font-style:normal!important}.typography-demo .spec b,.typography-demo .spec strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .typography-demo .spec b,.lt-ie9 .typography-demo .spec strong{font-weight:400!important} \ No newline at end of file diff --git a/src/css/main.min.css b/src/css/main.min.css new file mode 100644 index 0000000..0766235 --- /dev/null +++ b/src/css/main.min.css @@ -0,0 +1,17 @@ +/*! + * ad$$ $$ + * d$" $$ + * $$ $$ + * ,adPYba, $$$$$ $b,dPYba, $$,dPYba, + * aP' '$: $$ $$P' '$a $$P' '$a + * $( $$ $$( )$ $$( )$ + * "b, ,$: $$ $$b, ,$" $$b, ,$" + * `"Ybd$"' $$ $$`YbdP"' $$`Ybd$"' + * $$ + * $$ + * "" + * + * dev-dash - v0.1.0 + * https://github.com/cfpb/dev-dash * A public domain work of the Consumer Financial Protection Bureau + */ +@import url(//fast.fonts.net/t/1.css?apiType=css&projectid=44e8c964-4684-44c6-a6e3-3f3da8787b50);/*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}mark{background:#ff0;color:#000}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}/*! normalize-legacy-addon | MIT License | https://github.com/cfpb/normalize-legacy-addon */audio,canvas,video{*display:inline;*zoom:1}html{font-size:100%}button,html,input,select,textarea{font-family:sans-serif}h1{margin:.67em 0}h2{margin:.83em 0}h3{margin:1em 0}h4{margin:1.33em 0}h5{margin:1.67em 0}h6{margin:2.33em 0}p,pre{margin:1em 0}code,kbd,pre,samp{_font-family:'courier new',monospace}pre{white-space:pre;word-wrap:break-word}q{quotes:none}q:after,q:before{content:'';content:none}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ol,nav ul{list-style:none;list-style-image:none}img{-ms-interpolation-mode:bicubic}form{margin:0}legend{border:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{vertical-align:baseline;*vertical-align:middle}button,html input[type=button],input[type=reset],input[type=submit]{*overflow:visible}input[type=checkbox],input[type=radio]{*height:13px;*width:13px}.alert{position:relative;margin:0 0 2.5em;padding:.83333333em;padding-left:3.77777778em;background:#f1f2f2;color:#43484e;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500}.lt-ie9 .alert{font-weight:400!important}.alert_icon{position:absolute;top:0;left:0;bottom:0;min-width:1em;padding:.83333333em;background:#43484e;color:#fff;text-align:center}.alert_icon.cf-icon{line-height:1.375}.alert__success{background:#dbedd4;color:#005e5d}.alert__success .alert_icon{background:#005e5d}.alert__info{background:#cce3f5;border-color:#7fb8e6;color:#002d72}.alert__info .alert_icon{background:#002d72}.alert__warning{background:#ffecd1;border-color:#ffce8d;color:#5d554e}.alert__warning .alert_icon{background:#796e65}.alert__danger{background:#f6d9d3;border-color:#e8a091;color:#9c301b}.alert__danger .alert_icon{background:#9c301b}.breadcrumbs{display:inline-block;margin:.9375em 0;padding:0;border-bottom:4px solid #2cb34a;color:#43484e;font-size:1em;line-height:1;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;list-style-type:none}.lt-ie8 .breadcrumbs{display:inline}.lt-ie9 .breadcrumbs{font-weight:400!important}.breadcrumbs_item{display:inline-block;position:relative;margin:0 .375em .625em 0;padding-right:.625em}.lt-ie8 .breadcrumbs_item{display:inline}.breadcrumbs_item:after{content:"";display:block;width:1px;position:absolute;top:0;right:0;bottom:0;background:#babbbd;transform:skewX(-20deg)}.breadcrumbs_link{border-bottom-width:0!important}.breadcrumbs_link.focus,.breadcrumbs_link.hover,.breadcrumbs_link:focus,.breadcrumbs_link:hover{border-bottom-width:1px!important}.btn{display:inline-block;box-sizing:border-box;padding:.57142857em 1em;border:0;border-radius:.28571429em;margin:0;vertical-align:middle;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:.875em;line-height:normal;text-decoration:none;cursor:pointer;transition:.1s;-webkit-appearance:none}.lt-ie9 .btn{font-weight:400!important}.btn,.btn:link,.btn:visited{background-color:#0072ce;color:#fff}.btn.hover,.btn:hover{background-color:#328ed8}.btn.focus,.btn:focus{background-color:#328ed8;outline:1px dotted #0072ce;outline-offset:1px}.btn.active,.btn:active{background-color:#33578e}button.btn::-moz-focus-inner,input.btn::-moz-focus-inner{border:0}.btn+.btn{margin-left:.42857143em}.lt-ie8{background:url(null) fixed no-repeat}.lt-ie8 button.btn,.lt-ie8 input.btn{overflow:visible;padding-top:.45714286em;padding-bottom:.45714286em}.btn__secondary,.btn__secondary:link,.btn__secondary:visited{background-color:#75787b;color:#fff}.btn__secondary.hover,.btn__secondary:hover{background-color:#919395}.btn__secondary.focus,.btn__secondary:focus{background-color:#919395;outline-color:#75787b}.btn__secondary.active,.btn__secondary:active{background-color:#43484e}.btn__warning,.btn__warning:link,.btn__warning:visited{background-color:#d12124;color:#fff}.btn__warning.hover,.btn__warning:hover{background-color:#da6750}.btn__warning.focus,.btn__warning:focus{background-color:#da6750;outline-color:#d12124}.btn__warning.active,.btn__warning:active{background-color:#9c301b}.btn__disabled,.btn__disabled.active,.btn__disabled.focus,.btn__disabled.hover,.btn__disabled:active,.btn__disabled:focus,.btn__disabled:hover,.btn__disabled:link,.btn__disabled:visited{background-color:#e3e4e5;color:#75787b;cursor:default;cursor:not-allowed}.btn__disabled.focus,.btn__disabled:focus{outline-color:#75787b}.btn__super{padding:.61111111em 1.61111111em;font-size:1.125em}.btn__super+.btn__super{margin-left:.33333333em}.lt-ie8 button.btn__super,.lt-ie8 input.btn__super{padding-top:.66666667em;padding-bottom:.66666667em}.btn_icon__left{padding:0 .75em 0 0;border-right:1px solid #fff;border-right:1px solid rgba(255,255,255,.4);margin:0 .5em 0 0}.btn__disabled .btn_icon__left{border-right-color:#babbbd}.btn_icon__right{padding:0 0 0 .75em;border-right:0;border-left:1px solid #fff;border-left:1px solid rgba(255,255,255,.4);margin:0 0 0 .5em}.btn__disabled .btn_icon__right{border-left-color:#babbbd}.btn__grouped{border-radius:0}.btn__grouped-first{border-top-right-radius:0;border-bottom-right-radius:0}.btn__grouped-last{border-top-left-radius:0;border-bottom-left-radius:0}.btn__grouped,.btn__grouped+.btn__grouped,.btn__grouped+.btn__grouped-last,.btn__grouped-first+.btn__grouped,.btn__grouped-first+.btn__grouped-last,.btn__grouped-last{margin-left:-.21428571em}.btn__grouped-first.btn__super+.btn__grouped-last.btn__super,.btn__grouped-first.btn__super+.btn__grouped.btn__super,.btn__grouped-last.btn__super,.btn__grouped.btn__super,.btn__grouped.btn__super+.btn__grouped-last.btn__super,.btn__grouped.btn__super+.btn__grouped.btn__super{margin-left:-.16666667em}.btn__compound-action,.btn__compound-action:link,.btn__compound-action:visited{background-color:#328ed8}.btn__compound-action.hover,.btn__compound-action:focus,.btn__compound-action:hover{background-color:#0072ce}.btn__compound-action.btn__secondary{background-color:#919395}.btn__compound-action.btn__secondary.hover,.btn__compound-action.btn__secondary:focus,.btn__compound-action.btn__secondary:hover{background-color:#75787b}.btn__compound-action.btn__super{padding-left:1.22222222em;padding-right:1.22222222em}.btn__link{padding:0;border-bottom:1px dotted #0072ce;border-radius:0;margin:.57142857em 0}.btn__link,.btn__link:link,.btn__link:visited{background-color:transparent;color:#0072ce}.btn__link.hover,.btn__link:hover{border-bottom:1px solid #7fb8e6;background-color:transparent;color:#7fb8e6}.btn__link.focus,.btn__link:focus{border-bottom-style:solid;background-color:transparent;outline:thin dotted #0072ce}.btn__link.active,.btn__link:active{border-bottom:1px solid #002d72;background-color:transparent;color:#002d72}.lt-ie8 button.btn__link,.lt-ie8 input.btn__link{padding:0}.btn__link.btn__secondary,.btn__link.btn__secondary:link,.btn__link.btn__secondary:visited{border-bottom-color:#75787b;background-color:transparent;color:#75787b}.btn__link.btn__secondary.hover,.btn__link.btn__secondary:hover{border-bottom-color:#43484e;color:#43484e}.btn__link.btn__secondary.focus,.btn__link.btn__secondary:focus{outline-color:#75787b}.btn__link.btn__secondary.active,.btn__link.btn__secondary:active{border-bottom-color:#101820;color:#101820}.btn__link.btn__warning,.btn__link.btn__warning:link,.btn__link.btn__warning:visited{border-bottom-color:#d12124;background-color:transparent;color:#d12124}.btn__link.btn__warning.hover,.btn__link.btn__warning:hover{border-bottom-color:#da6750;color:#da6750}.btn__link.btn__warning.focus,.btn__link.btn__warning:focus{outline-color:#d12124}.btn__link.btn__warning.active,.btn__link.btn__warning:active{border-bottom-color:#9c301b;color:#9c301b}.expandable{margin-bottom:1.875em}.expandable_target{padding:0;border:0;background-color:transparent;cursor:pointer}.expandable_content:after{content:"";display:table;clear:both}.lt-ie8 .expandable_content{zoom:1}.expandable_label{color:#101820;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500}.lt-ie9 .expandable_label{font-weight:400!important}.expandable_link{color:#0072ce;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:.875em;line-height:1.57142857}.expandable_link em,.expandable_link i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .expandable_link em,.lt-ie9 .expandable_link i{font-style:normal!important}.expandable_link b,.expandable_link strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .expandable_link b,.lt-ie9 .expandable_link strong{font-weight:400!important}.expandable_cue-close__animated,.expandable_cue-open__animated{transition:.25s transform}.expandable_cue-close__animated{transform:rotate(180deg)}.expandable__expanded .expandable_cue-close__animated{transform:rotate(0)}.expandable__expanded .expandable_cue-open__animated{transform:rotate(-180deg)}.expandable_header{display:block}.expandable_header:after{content:"";display:table;clear:both}.lt-ie8 .expandable_header{zoom:1}button.expandable_header{width:100%;text-align:left}.expandable_header__spaced{padding-bottom:.9375em}.expandable_header-left{float:left}.expandable_header-right{float:right}.expandable__padded{margin-bottom:1.875em;background:#f1f2f2}.expandable__padded.expandable__expanded,.expandable__padded:hover{background:#e3e4e5}.expandable__padded .expandable_header{padding:.625em 1em}.expandable__padded .expandable_content{margin:0 1em 1.375em}.expandable__padded .expandable_content:before{content:'';display:block;height:1px;margin-bottom:1em;background:#babbbd}.expandable-group{margin-bottom:1.875em}.expandable-group_header{padding:.35714286em 1.14285714em;border-bottom:1px solid #919395;background:#f1f2f2;color:#75787b;font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;margin-bottom:0}.lt-ie9 .expandable-group_header{font-weight:400!important}.expandable-group .expandable{border-bottom:1px solid #919395;margin-bottom:0;background:#fff}.expandable-group .expandable_label{margin-top:0;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222;margin-bottom:0}.lt-ie9 .expandable-group .expandable_label{font-weight:400!important}.expandable-group .expandable_content{margin-bottom:0}.form-label-header{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;font-size:.875em;line-height:1.57142857;margin-bottom:.71428571em}.lt-ie9 .form-label-header{font-weight:400!important}.input__super[type=email],.input__super[type=number],.input__super[type=search],.input__super[type=tel],.input__super[type=text],.input__super[type=url]{padding:.55555556em;font-size:1.125em}.django-forms .error input[type=email],.django-forms .error input[type=number],.django-forms .error input[type=search],.django-forms .error input[type=tel],.django-forms .error input[type=text],.django-forms .error input[type=url],.django-forms .error select,.django-forms .error textarea,input[type=email].error,input[type=number].error,input[type=search].error,input[type=tel].error,input[type=text].error,input[type=url].error,select[multiple].error,textarea.error{border:1px solid #d12124;outline:1px solid #d12124}input[type=email].success,input[type=number].success,input[type=search].success,input[type=tel].success,input[type=text].success,input[type=url].success,select[multiple].success,textarea.success{border:1px solid #2cb34a;outline:1px solid #2cb34a}.cf-form_input-icon{position:relative;top:.3em;margin-left:.2em;font-size:1.25em}.error+.cf-form_input-icon{color:#d12124}.success+.cf-form_input-icon{color:#2cb34a}.form-group+.form-group{margin-top:1.875em}.form-group_item+.form-group_item{margin-top:.9375em}@media only all and (min-width:30em){.input-with-btn{display:block;position:relative;margin-left:-15px;margin-right:-15px}}.input-with-btn_input{margin-bottom:.9375em}@media only all and (min-width:30em){.input-with-btn_input{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:75%;border-right-width:0}.lt-ie8 .input-with-btn_input{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:60em){.input-with-btn_input{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:83.33333333%;border-right-width:0}.lt-ie8 .input-with-btn_input{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}.input-with-btn_input input{box-sizing:border-box;width:100%}.input-with-btn_btn{margin-bottom:.9375em}@media only all and (min-width:30em){.input-with-btn_btn{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:25%}.lt-ie8 .input-with-btn_btn{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:60em){.input-with-btn_btn{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:16.66666667%}.lt-ie8 .input-with-btn_btn{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}.input-with-btn_btn .btn{box-sizing:border-box;width:100%}.input-with-btn_btn .btn__super{padding-left:.83333333em;padding-right:.83333333em}.btn-inside-input{position:relative}.btn-inside-input input[type=email],.btn-inside-input input[type=number],.btn-inside-input input[type=search],.btn-inside-input input[type=tel],.btn-inside-input input[type=text],.btn-inside-input input[type=url]{box-sizing:border-box;width:100%;padding-right:4.64285714em}.btn-inside-input input[type=email].input__super,.btn-inside-input input[type=number].input__super,.btn-inside-input input[type=search].input__super,.btn-inside-input input[type=tel].input__super,.btn-inside-input input[type=text].input__super,.btn-inside-input input[type=url].input__super{padding-right:5em}.btn-inside-input .btn{border-bottom-width:0!important;position:absolute;right:1.07142857em;top:0}.btn-inside-input .btn__super{right:.83333333em}@font-face{font-family:'CFPB Minicons';src:url(/static/fonts/cf-icons.eot);src:url(/static/fonts/cf-icons.eot?#iefix) format('embedded-opentype'),url(/static/fonts/cf-icons.woff) format('woff'),url(/static/fonts/cf-icons.ttf) format('truetype'),url(/static/fonts/cf-icons.svg) format('svg');font-weight:400;font-style:normal}.cf-icon{font-family:'CFPB Minicons';display:inline-block;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased}.cf-icon-left:before{content:"\e000"}.lt-ie8 .cf-icon-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e000')}.cf-icon-left-round:before{content:"\e001"}.lt-ie8 .cf-icon-left-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e001')}.cf-icon-right:before{content:"\e002"}.lt-ie8 .cf-icon-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e002')}.cf-icon-right-round:before{content:"\e003"}.lt-ie8 .cf-icon-right-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e003')}.cf-icon-up:before{content:"\e004"}.lt-ie8 .cf-icon-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e004')}.cf-icon-up-round:before{content:"\e005"}.lt-ie8 .cf-icon-up-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e005')}.cf-icon-down:before{content:"\e006"}.lt-ie8 .cf-icon-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e006')}.cf-icon-down-round:before{content:"\e007"}.lt-ie8 .cf-icon-down-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e007')}.cf-icon-arrow-left:before{content:"\e008"}.lt-ie8 .cf-icon-arrow-left{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e008')}.cf-icon-arrow-left-round:before{content:"\e009"}.lt-ie8 .cf-icon-arrow-left-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e009')}.cf-icon-arrow-right:before{content:"\e010"}.lt-ie8 .cf-icon-arrow-right{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e010')}.cf-icon-arrow-right-round:before{content:"\e011"}.lt-ie8 .cf-icon-arrow-right-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e011')}.cf-icon-arrow-up:before{content:"\e012"}.lt-ie8 .cf-icon-arrow-up{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e012')}.cf-icon-arrow-up-round:before{content:"\e013"}.lt-ie8 .cf-icon-arrow-up-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e013')}.cf-icon-arrow-down:before{content:"\e014"}.lt-ie8 .cf-icon-arrow-down{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e014')}.cf-icon-arrow-down-round:before{content:"\e015"}.lt-ie8 .cf-icon-arrow-down-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e015')}.cf-icon-approved:before{content:"\e100"}.lt-ie8 .cf-icon-approved{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e100')}.cf-icon-approved-round:before{content:"\e101"}.lt-ie8 .cf-icon-approved-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e101')}.cf-icon-error:before{content:"\e102"}.lt-ie8 .cf-icon-error{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e102')}.cf-icon-error-round:before{content:"\e103"}.lt-ie8 .cf-icon-error-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e103')}.cf-icon-help:before{content:"\e104"}.lt-ie8 .cf-icon-help{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e104')}.cf-icon-help-round:before{content:"\e105"}.lt-ie8 .cf-icon-help-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e105')}.cf-icon-delete:before{content:"\e106"}.lt-ie8 .cf-icon-delete{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e106')}.cf-icon-delete-round:before{content:"\e107"}.lt-ie8 .cf-icon-delete-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e107')}.cf-icon-plus:before{content:"\e108"}.lt-ie8 .cf-icon-plus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e108')}.cf-icon-plus-round:before{content:"\e109"}.lt-ie8 .cf-icon-plus-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e109')}.cf-icon-minus:before{content:"\e110"}.lt-ie8 .cf-icon-minus{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e110')}.cf-icon-minus-round:before{content:"\e111"}.lt-ie8 .cf-icon-minus-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e111')}.cf-icon-update:before{content:"\e112"}.lt-ie8 .cf-icon-update{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e112')}.cf-icon-update-round:before{content:"\e113"}.lt-ie8 .cf-icon-update-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e113')}.cf-icon-youtube:before{content:"\e200"}.lt-ie8 .cf-icon-youtube{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e200')}.cf-icon-youtube-square:before{content:"\e201"}.lt-ie8 .cf-icon-youtube-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e201')}.cf-icon-linkedin:before{content:"\e202"}.lt-ie8 .cf-icon-linkedin{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e202')}.cf-icon-linkedin-square:before{content:"\e203"}.lt-ie8 .cf-icon-linkedin-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e203')}.cf-icon-facebook:before{content:"\e204"}.lt-ie8 .cf-icon-facebook{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e204')}.cf-icon-facebook-square:before{content:"\e205"}.lt-ie8 .cf-icon-facebook-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e205')}.cf-icon-flickr:before{content:"\e206"}.lt-ie8 .cf-icon-flickr{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e206')}.cf-icon-flickr-square:before{content:"\e207"}.lt-ie8 .cf-icon-flickr-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e207')}.cf-icon-twitter:before{content:"\e208"}.lt-ie8 .cf-icon-twitter{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e208')}.cf-icon-twitter-square:before{content:"\e209"}.lt-ie8 .cf-icon-twitter-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e209')}.cf-icon-github:before{content:"\e210"}.lt-ie8 .cf-icon-github{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e210')}.cf-icon-github-square:before{content:"\e211"}.lt-ie8 .cf-icon-github-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e211')}.cf-icon-email-social:before{content:"\e212"}.lt-ie8 .cf-icon-email-social{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e212')}.cf-icon-email-social-square:before{content:"\e213"}.lt-ie8 .cf-icon-email-social-square{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e213')}.cf-icon-web:before{content:"\e300"}.lt-ie8 .cf-icon-web{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e300')}.cf-icon-web-round:before{content:"\e301"}.lt-ie8 .cf-icon-web-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e301')}.cf-icon-email:before{content:"\e302"}.lt-ie8 .cf-icon-email{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e302')}.cf-icon-email-round:before{content:"\e303"}.lt-ie8 .cf-icon-email-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e303')}.cf-icon-mail:before{content:"\e304"}.lt-ie8 .cf-icon-mail{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e304')}.cf-icon-mail-round:before{content:"\e305"}.lt-ie8 .cf-icon-mail-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e305')}.cf-icon-phone:before{content:"\e306"}.lt-ie8 .cf-icon-phone{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e306')}.cf-icon-phone-round:before{content:"\e307"}.lt-ie8 .cf-icon-phone-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e307')}.cf-icon-technology:before{content:"\e308"}.lt-ie8 .cf-icon-technology{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e308')}.cf-icon-technology-round:before{content:"\e309"}.lt-ie8 .cf-icon-technology-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e309')}.cf-icon-fax:before{content:"\e310"}.lt-ie8 .cf-icon-fax{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e310')}.cf-icon-fax-round:before{content:"\e311"}.lt-ie8 .cf-icon-fax-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e311')}.cf-icon-document:before{content:"\e400"}.lt-ie8 .cf-icon-document{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e400')}.cf-icon-document-round:before{content:"\e401"}.lt-ie8 .cf-icon-document-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e401')}.cf-icon-pdf:before{content:"\e402"}.lt-ie8 .cf-icon-pdf{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e402')}.cf-icon-pdf-round:before{content:"\e403"}.lt-ie8 .cf-icon-pdf-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e403')}.cf-icon-upload:before{content:"\e404"}.lt-ie8 .cf-icon-upload{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e404')}.cf-icon-upload-round:before{content:"\e405"}.lt-ie8 .cf-icon-upload-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e405')}.cf-icon-download:before{content:"\e406"}.lt-ie8 .cf-icon-download{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e406')}.cf-icon-download-round:before{content:"\e407"}.lt-ie8 .cf-icon-download-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e407')}.cf-icon-copy:before{content:"\e408"}.lt-ie8 .cf-icon-copy{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e408')}.cf-icon-copy-round:before{content:"\e409"}.lt-ie8 .cf-icon-copy-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e409')}.cf-icon-edit:before{content:"\e410"}.lt-ie8 .cf-icon-edit{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e410')}.cf-icon-edit-round:before{content:"\e411"}.lt-ie8 .cf-icon-edit-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e411')}.cf-icon-attach:before{content:"\e412"}.lt-ie8 .cf-icon-attach{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e412')}.cf-icon-attach-round:before{content:"\e413"}.lt-ie8 .cf-icon-attach-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e413')}.cf-icon-print:before{content:"\e414"}.lt-ie8 .cf-icon-print{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e414')}.cf-icon-print-round:before{content:"\e415"}.lt-ie8 .cf-icon-print-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e415')}.cf-icon-save:before{content:"\e416"}.lt-ie8 .cf-icon-save{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e416')}.cf-icon-save-round:before{content:"\e417"}.lt-ie8 .cf-icon-save-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e417')}.cf-icon-appendix:before{content:"\e418"}.lt-ie8 .cf-icon-appendix{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e418')}.cf-icon-appendix-round:before{content:"\e419"}.lt-ie8 .cf-icon-appendix-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e419')}.cf-icon-supplement:before{content:"\e420"}.lt-ie8 .cf-icon-supplement{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e420')}.cf-icon-supplement-round:before{content:"\e421"}.lt-ie8 .cf-icon-supplement-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e421')}.cf-icon-rss:before{content:"\e422"}.lt-ie8 .cf-icon-rss{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e422')}.cf-icon-rss-round:before{content:"\e423"}.lt-ie8 .cf-icon-rss-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e423')}.cf-icon-bank-account:before{content:"\e500"}.lt-ie8 .cf-icon-bank-account{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e500')}.cf-icon-bank-account-round:before{content:"\e501"}.lt-ie8 .cf-icon-bank-account-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e501')}.cf-icon-credit-card:before{content:"\e502"}.lt-ie8 .cf-icon-credit-card{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e502')}.cf-icon-credit-card-round:before{content:"\e503"}.lt-ie8 .cf-icon-credit-card-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e503')}.cf-icon-loan:before{content:"\e504"}.lt-ie8 .cf-icon-loan{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e504')}.cf-icon-loan-round:before{content:"\e505"}.lt-ie8 .cf-icon-loan-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e505')}.cf-icon-money-transfer:before{content:"\e506"}.lt-ie8 .cf-icon-money-transfer{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e506')}.cf-icon-money-transfer-round:before{content:"\e507"}.lt-ie8 .cf-icon-money-transfer-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e507')}.cf-icon-mortgage:before{content:"\e508"}.lt-ie8 .cf-icon-mortgage{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e508')}.cf-icon-mortgage-round:before{content:"\e509"}.lt-ie8 .cf-icon-mortgage-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e509')}.cf-icon-debt-collection:before{content:"\e510"}.lt-ie8 .cf-icon-debt-collection{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e510')}.cf-icon-debt-collection-round:before{content:"\e511"}.lt-ie8 .cf-icon-debt-collection-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e511')}.cf-icon-credit-report:before{content:"\e512"}.lt-ie8 .cf-icon-credit-report{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e512')}.cf-icon-credit-report-round:before{content:"\e513"}.lt-ie8 .cf-icon-credit-report-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e513')}.cf-icon-money:before{content:"\e514"}.lt-ie8 .cf-icon-money{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e514')}.cf-icon-money-round:before{content:"\e515"}.lt-ie8 .cf-icon-money-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e515')}.cf-icon-quick-cash:before{content:"\e516"}.lt-ie8 .cf-icon-quick-cash{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e516')}.cf-icon-quick-cash-round:before{content:"\e517"}.lt-ie8 .cf-icon-quick-cash-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e517')}.cf-icon-contract:before{content:"\e518"}.lt-ie8 .cf-icon-contract{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e518')}.cf-icon-contract-round:before{content:"\e519"}.lt-ie8 .cf-icon-contract-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e519')}.cf-icon-complaint:before{content:"\e520"}.lt-ie8 .cf-icon-complaint{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e520')}.cf-icon-complaint-round:before{content:"\e521"}.lt-ie8 .cf-icon-complaint-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e521')}.cf-icon-getting-credit-card:before{content:"\e522"}.lt-ie8 .cf-icon-getting-credit-card{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e522')}.cf-icon-getting-credit-card-round:before{content:"\e523"}.lt-ie8 .cf-icon-getting-credit-card-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e523')}.cf-icon-buying-car:before{content:"\e524"}.lt-ie8 .cf-icon-buying-car{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e524')}.cf-icon-buying-car-round:before{content:"\e525"}.lt-ie8 .cf-icon-buying-car-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e525')}.cf-icon-paying-college:before{content:"\e526"}.lt-ie8 .cf-icon-paying-college{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e526')}.cf-icon-paying-college-round:before{content:"\e527"}.lt-ie8 .cf-icon-paying-college-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e527')}.cf-icon-owning-home:before{content:"\e528"}.lt-ie8 .cf-icon-owning-home{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e528')}.cf-icon-owning-home-round:before{content:"\e529"}.lt-ie8 .cf-icon-owning-home-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e529')}.cf-icon-debt:before{content:"\e530"}.lt-ie8 .cf-icon-debt{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e530')}.cf-icon-debt-round:before{content:"\e531"}.lt-ie8 .cf-icon-debt-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e531')}.cf-icon-building-credit:before{content:"\e532"}.lt-ie8 .cf-icon-building-credit{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e532')}.cf-icon-building-credit-round:before{content:"\e533"}.lt-ie8 .cf-icon-building-credit-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e533')}.cf-icon-prepaid-cards:before{content:"\e534"}.lt-ie8 .cf-icon-prepaid-cards{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e534')}.cf-icon-prepaid-cards-round:before{content:"\e535"}.lt-ie8 .cf-icon-prepaid-cards-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e535')}.cf-icon-payday-loan:before{content:"\e536"}.lt-ie8 .cf-icon-payday-loan{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e536')}.cf-icon-payday-loan-round:before{content:"\e537"}.lt-ie8 .cf-icon-payday-loan-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e537')}.cf-icon-retirement:before{content:"\e538"}.lt-ie8 .cf-icon-retirement{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e538')}.cf-icon-retirement-round:before{content:"\e539"}.lt-ie8 .cf-icon-retirement-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e539')}.cf-icon-user:before{content:"\e600"}.lt-ie8 .cf-icon-user{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e600')}.cf-icon-user-round:before{content:"\e601"}.lt-ie8 .cf-icon-user-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e601')}.cf-icon-wifi:before{content:"\e602"}.lt-ie8 .cf-icon-wifi{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e602')}.cf-icon-wifi-round:before{content:"\e603"}.lt-ie8 .cf-icon-wifi-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e603')}.cf-icon-search:before{content:"\e604"}.lt-ie8 .cf-icon-search{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e604')}.cf-icon-search-round:before{content:"\e605"}.lt-ie8 .cf-icon-search-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e605')}.cf-icon-share:before{content:"\e606"}.lt-ie8 .cf-icon-share{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e606')}.cf-icon-share-round:before{content:"\e607"}.lt-ie8 .cf-icon-share-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e607')}.cf-icon-link:before{content:"\e608"}.lt-ie8 .cf-icon-link{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e608')}.cf-icon-link-round:before{content:"\e609"}.lt-ie8 .cf-icon-link-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e609')}.cf-icon-external-link:before{content:"\e610"}.lt-ie8 .cf-icon-external-link{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e610')}.cf-icon-external-link-round:before{content:"\e611"}.lt-ie8 .cf-icon-external-link-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e611')}.cf-icon-audio-mute:before{content:"\e612"}.lt-ie8 .cf-icon-audio-mute{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e612')}.cf-icon-audio-mute-round:before{content:"\e616"}.lt-ie8 .cf-icon-audio-mute-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e616')}.cf-icon-audio-low:before{content:"\e613"}.lt-ie8 .cf-icon-audio-low{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e613')}.cf-icon-audio-low-round:before{content:"\e617"}.lt-ie8 .cf-icon-audio-low-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e617')}.cf-icon-audio-medium:before{content:"\e614"}.lt-ie8 .cf-icon-audio-medium{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e614')}.cf-icon-audio-medium-round:before{content:"\e618"}.lt-ie8 .cf-icon-audio-medium-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e618')}.cf-icon-audio-max:before{content:"\e615"}.lt-ie8 .cf-icon-audio-max{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e615')}.cf-icon-audio-max-round:before{content:"\e619"}.lt-ie8 .cf-icon-audio-max-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e619')}.cf-icon-favorite:before{content:"\e620"}.lt-ie8 .cf-icon-favorite{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e620')}.cf-icon-favorite-round:before{content:"\e621"}.lt-ie8 .cf-icon-favorite-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e621')}.cf-icon-unfavorite:before{content:"\e622"}.lt-ie8 .cf-icon-unfavorite{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e622')}.cf-icon-unfavorite-round:before{content:"\e623"}.lt-ie8 .cf-icon-unfavorite-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e623')}.cf-icon-bookmark:before{content:"\e624"}.lt-ie8 .cf-icon-bookmark{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e624')}.cf-icon-bookmark-round:before{content:"\e625"}.lt-ie8 .cf-icon-bookmark-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e625')}.cf-icon-unbookmark:before{content:"\e626"}.lt-ie8 .cf-icon-unbookmark{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e626')}.cf-icon-unbookmark-round:before{content:"\e627"}.lt-ie8 .cf-icon-unbookmark-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e627')}.cf-icon-settings:before{content:"\e628"}.lt-ie8 .cf-icon-settings{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e628')}.cf-icon-settings-round:before{content:"\e629"}.lt-ie8 .cf-icon-settings-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e629')}.cf-icon-menu:before{content:"\e630"}.lt-ie8 .cf-icon-menu{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e630')}.cf-icon-menu-round:before{content:"\e631"}.lt-ie8 .cf-icon-menu-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e631')}.cf-icon-lock:before{content:"\e632"}.lt-ie8 .cf-icon-lock{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e632')}.cf-icon-lock-round:before{content:"\e633"}.lt-ie8 .cf-icon-lock-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e633')}.cf-icon-unlock:before{content:"\e634"}.lt-ie8 .cf-icon-unlock{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e634')}.cf-icon-unlock-round:before{content:"\e635"}.lt-ie8 .cf-icon-unlock-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e635')}.cf-icon-clock:before{content:"\e636"}.lt-ie8 .cf-icon-clock{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e636')}.cf-icon-clock-round:before{content:"\e637"}.lt-ie8 .cf-icon-clock-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e637')}.cf-icon-chart:before{content:"\e638"}.lt-ie8 .cf-icon-chart{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e638')}.cf-icon-chart-round:before{content:"\e639"}.lt-ie8 .cf-icon-chart-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e639')}.cf-icon-play:before{content:"\e640"}.lt-ie8 .cf-icon-play{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e640')}.cf-icon-play-round:before{content:"\e641"}.lt-ie8 .cf-icon-play-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e641')}.cf-icon-newspaper:before{content:"\e700"}.lt-ie8 .cf-icon-newspaper{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e700')}.cf-icon-newspaper-round:before{content:"\e701"}.lt-ie8 .cf-icon-newspaper-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e701')}.cf-icon-microphone:before{content:"\e702"}.lt-ie8 .cf-icon-microphone{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e702')}.cf-icon-microphone-round:before{content:"\e703"}.lt-ie8 .cf-icon-microphone-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e703')}.cf-icon-bullhorn:before{content:"\e704"}.lt-ie8 .cf-icon-bullhorn{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e704')}.cf-icon-bullhorn-round:before{content:"\e705"}.lt-ie8 .cf-icon-bullhorn-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e705')}.cf-icon-double-quote:before{content:"\e708"}.lt-ie8 .cf-icon-double-quote{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e708')}.cf-icon-double-quote-round:before{content:"\e709"}.lt-ie8 .cf-icon-double-quote-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e709')}.cf-icon-speech-bubble:before{content:"\e710"}.lt-ie8 .cf-icon-speech-bubble{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e710')}.cf-icon-speech-bubble-round:before{content:"\e711"}.lt-ie8 .cf-icon-speech-bubble-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e711')}.cf-icon-information:before{content:"\e712"}.lt-ie8 .cf-icon-information{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e712')}.cf-icon-information-round:before{content:"\e713"}.lt-ie8 .cf-icon-information-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e713')}.cf-icon-lightbulb:before{content:"\e714"}.lt-ie8 .cf-icon-lightbulb{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e714')}.cf-icon-lightbulb-round:before{content:"\e715"}.lt-ie8 .cf-icon-lightbulb-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e715')}.cf-icon-dialogue:before{content:"\e716"}.lt-ie8 .cf-icon-dialogue{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e716')}.cf-icon-dialogue-round:before{content:"\e717"}.lt-ie8 .cf-icon-dialogue-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e717')}.cf-icon-date:before{content:"\e718"}.lt-ie8 .cf-icon-date{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e718')}.cf-icon-date-round:before{content:"\e719"}.lt-ie8 .cf-icon-date-round{*zoom:expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '\e719')}.content-l{position:relative}@media only all and (min-width:37.5em){.content-l{display:block;position:relative;margin-left:-15px;margin-right:-15px}}@media only all and (min-width:37.5em){.content-l__large-gutters{margin-left:-30px;margin-right:-30px}.content-l__large-gutters .content-l_col{border-left-width:30px;border-right-width:30px}}.content-l_col+.content-l_col{margin-top:1.875em}@media only all and (min-width:37.5em){.content-l_col.content-l_col-1-2+.content-l_col.content-l_col-1-2{margin-top:0}}@media only all and (min-width:48em){.content-l_col.content-l_col-1-3+.content-l_col.content-l_col-1-3,.content-l_col.content-l_col-3-8+.content-l_col.content-l_col-3-8,.content-l_col.content-l_col-3-8+.content-l_col.content-l_col-5-8,.content-l_col.content-l_col-5-8+.content-l_col.content-l_col-3-8{margin-top:0}}@media only all and (min-width:37.5em){.content-l_col-1{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-1{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:37.5em){.content-l_col-1-2{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .content-l_col-1-2{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:37.5em){.content-l_col-1-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-1-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:48em){.content-l_col-1-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%}.lt-ie8 .content-l_col-1-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:37.5em){.content-l_col-2-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-2-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:48em){.content-l_col-2-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%}.lt-ie8 .content-l_col-2-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:37.5em){.content-l_col-3-8{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-3-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:48em){.content-l_col-3-8{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:37.5%}.lt-ie8 .content-l_col-3-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:37.5em){.content-l_col-5-8{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col-5-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:48em){.content-l_col-5-8{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:62.5%}.lt-ie8 .content-l_col-5-8{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:50.0625em){.content-l_col__stack-on-cols{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content-l_col__stack-on-cols{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (max-width:37.4375em){.content-l_col__before-divider.content-l_col-1-2{margin-top:3.75em}.content-l_col__before-divider.content-l_col-1-2:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd}}@media only all and (min-width:37.5em){.content-l_col__before-divider.content-l_col-1-2{border-left-width:30px}.content-l_col__before-divider.content-l_col-1-2:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}}@media only all and (max-width:47.9375em){.content-l_col__before-divider.content-l_col-1-3{margin-top:3.75em}.content-l_col__before-divider.content-l_col-1-3:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd}}@media only all and (min-width:48em){.content-l_col__before-divider.content-l_col-1-3{border-left-width:30px}.content-l_col__before-divider.content-l_col-1-3:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}}.content_bar{height:10px;background:#2cb34a}.content_line{height:1px;background:#babbbd}.content_intro,.content_main,.content_sidebar{padding:1.875em .9375em}@media only all and (min-width:37.5em){.content_intro,.content_main,.content_sidebar{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%;padding:3.75em .9375em}.lt-ie8 .content_intro,.lt-ie8 .content_main,.lt-ie8 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:50.0625em){.content_intro,.content_main,.content_sidebar{padding:3.75em 0}}@media only all and (min-width:50.0625em){.content_intro{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:100%}.lt-ie8 .content_intro{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:50.0625em){.content__1-3 .content_sidebar{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:25%;padding-right:1.875em}.lt-ie8 .content__1-3 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__1-3 .content_main{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:75%;position:relative}.lt-ie8 .content__1-3 .content_main{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__1-3 .content_main:after{content:'';border-left:1px solid #babbbd;position:absolute;top:3.75em;bottom:0;left:-1.875em}.content__2-1 .content_main{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%}.lt-ie8 .content__2-1 .content_main{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.content__2-1 .content_main:after{right:-1.875em}.content__2-1 .content_sidebar{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%;padding-left:1.875em}.lt-ie8 .content__2-1 .content_sidebar{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}@media only all and (min-width:64em){.content__2-1 .content_main__narrow{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%;padding-right:8.33333333%}.lt-ie8 .content__2-1 .content_main__narrow{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc);padding-right:0}}.content__flush-bottom{padding-bottom:0}@media only all and (max-width:50em){.content__flush-top-on-small{padding-top:0}}@media only all and (max-width:50em){.content__flush-all-on-small{padding:0;border-width:0}}.block{margin-top:3.75em;margin-bottom:3.75em}.block__border-top{border-top:1px solid #babbbd}.block__border-bottom{border-bottom:1px solid #babbbd}.block__flush-top{margin-top:0!important}.block__flush-bottom{margin-bottom:0!important}.block__flush-sides{margin-right:-15px;margin-left:-15px}@media only all and (min-width:37.5em){.block__flush-sides{margin-right:-30px;margin-left:-30px}}.block__bg{padding:1.875em .9375em;background:#f1f2f2}@media only all and (min-width:37.5em){.block__bg{padding:2.8125em 1.875em}}.block__padded-top{padding-top:1.875em;margin-top:1.875em}.block__padded-bottom{padding-bottom:1.875em;margin-bottom:1.875em}.block__sub{margin-top:1.875em;margin-bottom:1.875em}@media only all and (min-width:37.5em){.content-l_col.block,.content-l_col.block__sub{margin-top:0}}.content__bleedbar .content_main:after{content:none}.content__bleedbar .content_sidebar{padding:1.875em .9375em;background:#f1f2f2}@media only all and (min-width:50.0625em){.content__bleedbar{overflow:hidden}.content__bleedbar .content_sidebar{padding:3.75em 0 .9375em 1.875em;margin-left:0;position:relative;z-index:1;background:0 0}.lt-ie8 .content__bleedbar .content_sidebar{padding-right:30px;background:#f1f2f2}.content__bleedbar .content_wrapper:after{content:'';display:block;width:9999px;border-left:1px solid #babbbd;height:100%;position:absolute;top:0;z-index:0;margin-left:10px;background:#f1f2f2}.content__bleedbar.content__2-1 .content_wrapper:after{left:66.666666667%}.content__bleedbar.content__3-1 .content_wrapper:after{left:75%}}@media only all and (min-width:50.0625em){.content_wrapper,.wrapper{max-width:1170px;padding:0 15px;margin:0 auto;position:relative;clear:both}}.content_wrapper__match-content,.wrapper__match-content{padding-left:15px;padding-right:15px}@media only all and (min-width:37.5em){.content_wrapper__match-content,.wrapper__match-content{padding-left:30px;padding-right:30px;max-width:1140px}}.lt-ie9 .content_wrapper,.lt-ie9 .wrapper{max-width:960px}.lt-ie9 body{min-width:800px}.grid_column__top-divider{margin-top:3.75em}.grid_column__top-divider:before{content:"";display:block;height:1px;margin-bottom:1.875em;background-color:#babbbd}.grid_column__left-divider{border-left-width:30px}.grid_column__left-divider:before{content:"";position:absolute;top:0;bottom:0;width:1px;display:block;background-color:#babbbd;margin-left:-30px}.tabs{margin:0 0 1em}.tabs_list{margin:0;padding:0;border-bottom:4px solid #2cb34a;list-style-type:none}.tabs_list:after{content:"";display:table;clear:both}.lt-ie8 .tabs_list{zoom:1}.tabs_list-item{float:left;margin:0;padding:0}.tabs_tab{display:block;margin-right:.5em;padding:.5em 1.875em;border:none;background-color:#e3e4e5;color:#101820;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;text-decoration:none}.tabs_tab em,.tabs_tab i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .tabs_tab em,.lt-ie9 .tabs_tab i{font-style:normal!important}.tabs_tab b,.tabs_tab strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .tabs_tab b,.lt-ie9 .tabs_tab strong{font-weight:400!important}.tabs_tab:focus,.tabs_tab:hover{border:none;background-color:#addc91}.tabs_tab:focus{outline:1px dotted #2cb34a;outline-offset:1px}.tabs_tab.is-active{background-color:#2cb34a;color:#fff}.tabs_panel{padding-top:.9375em}.tabs_panel:focus{outline:1px dotted #2cb34a;outline-offset:1px}.no-js .u-js-only{display:none!important}.u-clearfix:after{content:"";display:table;clear:both}.lt-ie8 .u-clearfix{zoom:1}.u-visually-hidden{position:absolute;overflow:hidden;clip:rect(0 0 0 0);height:1px;width:1px;margin:-1px;padding:0;border:0}.u-inline-block{display:inline-block}.lt-ie8 .u-inline-block{display:inline}.u-right{float:right}.u-break-word{word-break:break-all}.u-flexible-container{position:relative;padding-bottom:56.25%;height:0}.u-flexible-container_inner{position:absolute;top:0;left:0;width:100%;height:100%}.u-flexible-container__4-3{position:relative;padding-bottom:75%;height:0}.u-mt0{margin-top:0!important}.u-mb0{margin-bottom:0!important}.u-mt5{margin-top:5px!important}.u-mb5{margin-bottom:5px!important}.u-mt10{margin-top:10px!important}.u-mb10{margin-bottom:10px!important}.u-mt15{margin-top:15px!important}.u-mb15{margin-bottom:15px!important}.u-mt20{margin-top:20px!important}.u-mb20{margin-bottom:20px!important}.u-mt30{margin-top:30px!important}.u-mb30{margin-bottom:30px!important}.u-mt45{margin-top:45px!important}.u-mb45{margin-bottom:45px!important}.u-mt60{margin-top:60px!important}.u-mb60{margin-bottom:60px!important}.u-w100pct{width:100%}.u-w90pct{width:90%}.u-w80pct{width:80%}.u-w70pct{width:70%}.u-w60pct{width:60%}.u-w50pct{width:50%}.u-w40pct{width:40%}.u-w30pct{width:30%}.u-w20pct{width:20%}.u-w10pct{width:10%}.u-w75pct{width:75%}.u-w25pct{width:25%}.u-w66pct{width:66.66666667%}.u-w33pct{width:33.33333333%}@media only all and (max-width:37.4375em){.u-hide-on-mobile{display:none}}.u-show-on-mobile{display:none}@media only all and (max-width:37.4375em){.u-show-on-mobile{display:block}}.u-small-text,small{font-size:.875em}@font-face{font-family:AvenirNextLTW01-Regular;src:url(//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:400}@font-face{font-family:AvenirNextLTW01-Regular;src:url(//fast.fonts.net/dv2/2/e9167238-3b3f-4813-a04a-a384394eed42.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/1e9892c0-6927-4412-9874-1b82801ba47a.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/46cf1067-688d-4aab-b0f7-bd942af6efd8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/52a192b1-bea5-4b48-879f-107f009b666f.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#52a192b1-bea5-4b48-879f-107f009b666f) format("svg");font-style:normal;font-weight:400}@font-face{font-family:AvenirNextLTW01-Italic;src:url(//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:italic;font-weight:400}@font-face{font-family:AvenirNextLTW01-Italic;src:url(//fast.fonts.net/dv2/2/d1fddef1-d940-4904-8f6c-17e809462301.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/92b66dbd-4201-4ac2-a605-4d4ffc8705cc.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/18839597-afa8-4f0b-9abb-4a30262d0da8.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#1de7e6f4-9d4d-47e7-ab23-7d5cf10ab585) format("svg");font-style:italic;font-weight:400}@font-face{font-family:AvenirNextLTW01-Medium;src:url(//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:500}@font-face{font-family:AvenirNextLTW01-Medium;src:url(//fast.fonts.net/dv2/2/1a7c9181-cd24-4943-a9d9-d033189524e0.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/f26faddb-86cc-4477-a253-1e1287684336.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/63a74598-733c-4d0c-bd91-b01bffcd6e69.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/a89d6ad1-a04f-4a8f-b140-e55478dbea80.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#a89d6ad1-a04f-4a8f-b140-e55478dbea80) format("svg");font-style:normal;font-weight:500}@font-face{font-family:AvenirNextLTW01-Demi;src:url(//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("eot");font-style:normal;font-weight:700}@font-face{font-family:AvenirNextLTW01-Demi;src:url(//fast.fonts.net/dv2/2/12d643f2-3899-49d5-a85b-ff430f5fad15.eot?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50);src:url(//fast.fonts.net/dv2/3/91b50bbb-9aa1-4d54-9159-ec6f19d14a7c.woff?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("woff"),url(//fast.fonts.net/dv2/1/a0f4c2f9-8a42-4786-ad00-fce42b57b148.ttf?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50) format("truetype"),url(//fast.fonts.net/dv2/11/99affa9a-a5e9-4559-bd07-20cf0071852d.svg?d44f19a684109620e4841679af90e818b934c450213fb296d217dd76fbd8133e8104ffce1b8d7381e92baf075aac747ded01b441045f936c159eb0f46c11e1f99e958a3e0d6904164b21814766132f7cb38b46df85fb387875d6907338f619856e049c29c288424547a2ca329b1d0251faf8c505bae9c3ec3d5a1e4327f5fdf46ffb088d97582c65a45857e1e0662c2d545166a03c7b024ca17ac3839d703086c5f9fd694b6f5493360c3bcd9d5d427b599ea7651d27005ca2f4c1d0312515f51a323f79b7f5cf1afa2ab67a3ddbfee1&projectId=44e8c964-4684-44c6-a6e3-3f3da8787b50#99affa9a-a5e9-4559-bd07-20cf0071852d) format("svg");font-style:normal;font-weight:700}body{color:#101820;font-family:Georgia,"Times New Roman",serif;font-size:100%;line-height:1.375}.h1,.h2,.h3,h1,h2,h3{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.h1 em,.h1 i,.h2 em,.h2 i,.h3 em,.h3 i,h1 em,h1 i,h2 em,h2 i,h3 em,h3 i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .h1 em,.lt-ie9 .h1 i,.lt-ie9 .h2 em,.lt-ie9 .h2 i,.lt-ie9 .h3 em,.lt-ie9 .h3 i,.lt-ie9 h1 em,.lt-ie9 h1 i,.lt-ie9 h2 em,.lt-ie9 h2 i,.lt-ie9 h3 em,.lt-ie9 h3 i{font-style:normal!important}.h1 b,.h1 strong,.h2 b,.h2 strong,.h3 b,.h3 strong,h1 b,h1 strong,h2 b,h2 strong,h3 b,h3 strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .h1 b,.lt-ie9 .h1 strong,.lt-ie9 .h2 b,.lt-ie9 .h2 strong,.lt-ie9 .h3 b,.lt-ie9 .h3 strong,.lt-ie9 h1 b,.lt-ie9 h1 strong,.lt-ie9 h2 b,.lt-ie9 h2 strong,.lt-ie9 h3 b,.lt-ie9 h3 strong{font-weight:400!important}.h1,h1{margin-top:0;margin-bottom:.47058824em;font-size:2.125em;line-height:1.29411765}@media only all and (max-width:37.4375em){.h1,h1{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.73076923em;font-size:1.625em;line-height:1.26923077}.h1 em,.h1 i,h1 em,h1 i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .h1 em,.lt-ie9 .h1 i,.lt-ie9 h1 em,.lt-ie9 h1 i{font-style:normal!important}.h1 b,.h1 strong,h1 b,h1 strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .h1 b,.lt-ie9 .h1 strong,.lt-ie9 h1 b,.lt-ie9 h1 strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.h1,h1{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}.h1 em,.h1 i,h1 em,h1 i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .h1 em,.lt-ie9 .h1 i,.lt-ie9 h1 em,.lt-ie9 h1 i{font-style:normal!important}.h1 b,.h1 strong,h1 b,h1 strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .h1 b,.lt-ie9 .h1 strong,.lt-ie9 h1 b,.lt-ie9 h1 strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.h1,h1{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .h1,.lt-ie9 h1{font-weight:400!important}}.h2,h2{margin-top:0;margin-bottom:.73076923em;font-size:1.625em;line-height:1.26923077}@media only all and (max-width:37.4375em){.h2,h2{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}.h2 em,.h2 i,h2 em,h2 i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .h2 em,.lt-ie9 .h2 i,.lt-ie9 h2 em,.lt-ie9 h2 i{font-style:normal!important}.h2 b,.h2 strong,h2 b,h2 strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .h2 b,.lt-ie9 .h2 strong,.lt-ie9 h2 b,.lt-ie9 h2 strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.h2,h2{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .h2,.lt-ie9 h2{font-weight:400!important}}.h3,h3{margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}@media only all and (max-width:37.4375em){.h3,h3{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .h3,.lt-ie9 h3{font-weight:400!important}}.h4,h4{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .h4,.lt-ie9 h4{font-weight:400!important}.h5,.h6,h5,h6{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase}.lt-ie9 .h5,.lt-ie9 .h6,.lt-ie9 h5,.lt-ie9 h6{font-weight:400!important}.h5,h5{margin-top:0;margin-bottom:.35714286em;font-size:.875em;line-height:1.57142857}.h6,h6{margin-top:0;margin-bottom:.41666667em;font-size:.75em;line-height:1.83333333}.superheader{margin-bottom:.1875em;font-size:3em;font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;line-height:1.25}.lt-ie9 .superheader{font-weight:400!important}dl,figure,ol,p,table,ul{margin-top:0;margin-bottom:1.25em}a{border-width:0;border-style:dotted;border-color:#0072ce;color:#0072ce;text-decoration:none}a.visited,a:visited{border-color:#005e5d;color:#005e5d}a.hover,a:hover{border-style:solid;border-color:#7fb8e6;color:#7fb8e6}a.focus,a:focus{border-style:solid;outline:thin dotted}a.active,a:active{border-style:solid;border-color:#002d72;color:#002d72}dd a,li a,p a{border-bottom-width:1px}nav a{border-bottom-width:0}ul{list-style:square}table{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}table em,table i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 table em,.lt-ie9 table i{font-style:normal!important}table b,table strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 table b,.lt-ie9 table strong{font-weight:400!important}td,th{padding:.75em .9375em;background:#f8f8f8}thead td,thead th{color:#fff;background:#43484e}tbody>tr:nth-child(odd)>td,tbody>tr:nth-child(odd)>th{background:#f1f2f2}.compact-table td,.compact-table th{padding:.4375em .625em}th{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;text-align:left}.lt-ie9 th{font-weight:400!important}blockquote{margin:1.25em}@media only all and (min-width:37.5em){blockquote{margin:1.75em 2.5em}}.pull-quote_body{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:1.375em;line-height:1.27272727;margin-bottom:.54545455em;color:#101820}.pull-quote_body em,.pull-quote_body i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .pull-quote_body em,.lt-ie9 .pull-quote_body i{font-style:normal!important}.pull-quote_body b,.pull-quote_body strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .pull-quote_body b,.lt-ie9 .pull-quote_body strong{font-weight:400!important}@media only all and (max-width:37.4375em){.pull-quote_body{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .pull-quote_body{font-weight:400!important}}.pull-quote_citation{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;margin-top:0;margin-bottom:.35714286em;font-size:.875em;line-height:1.57142857;color:#75787b}.lt-ie9 .pull-quote_citation{font-weight:400!important}.pull-quote__large .pull-quote_body{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:1.625em;line-height:1.26923077;margin-bottom:.69230769em}.pull-quote__large .pull-quote_body em,.pull-quote__large .pull-quote_body i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .pull-quote__large .pull-quote_body em,.lt-ie9 .pull-quote__large .pull-quote_body i{font-style:normal!important}.pull-quote__large .pull-quote_body b,.pull-quote__large .pull-quote_body strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .pull-quote__large .pull-quote_body b,.lt-ie9 .pull-quote__large .pull-quote_body strong{font-weight:400!important}@media only all and (max-width:37.4375em){.pull-quote__large .pull-quote_body{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}.pull-quote__large .pull-quote_body em,.pull-quote__large .pull-quote_body i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .pull-quote__large .pull-quote_body em,.lt-ie9 .pull-quote__large .pull-quote_body i{font-style:normal!important}.pull-quote__large .pull-quote_body b,.pull-quote__large .pull-quote_body strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .pull-quote__large .pull-quote_body b,.lt-ie9 .pull-quote__large .pull-quote_body strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.pull-quote__large .pull-quote_body{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .pull-quote__large .pull-quote_body{font-weight:400!important}}label{display:block;margin-bottom:.3125em;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}label em,label i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 label em,.lt-ie9 label i{font-style:normal!important}label b,label strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 label b,.lt-ie9 label strong{font-weight:400!important}label input[type=checkbox],label input[type=radio]{margin-right:.375em}input[type=email],input[type=number],input[type=search],input[type=tel],input[type=text],input[type=url],select[multiple],textarea{display:inline-block;margin:0;padding:.375em;font-family:Arial,sans-serif;font-size:1em;background:#fff;border:1px solid #75787b;border-radius:0;vertical-align:top;-webkit-appearance:none;-webkit-user-modify:read-write-plaintext-only}::-webkit-search-decoration{-webkit-appearance:none}input[type=email].focus,input[type=email]:focus,input[type=number].focus,input[type=number]:focus,input[type=search].focus,input[type=search]:focus,input[type=tel].focus,input[type=tel]:focus,input[type=text].focus,input[type=text]:focus,input[type=url].focus,input[type=url]:focus,select[multiple].focus,select[multiple]:focus,textarea.focus,textarea:focus{border:1px solid #0072ce;outline:1px solid #0072ce;outline-offset:0;box-shadow:none}::-webkit-input-placeholder{color:#75787b}::-moz-placeholder{color:#75787b}:-ms-input-placeholder{color:#75787b}img{max-width:100%}figure{margin-left:0;margin-right:0}figure img{vertical-align:middle}.figure__bordered img{border:1px solid #babbbd}.list__branded li{position:relative;list-style-type:none;padding-bottom:.75em}.list__branded li:before{content:"\25AA";position:absolute;color:#2cb34a;font-size:1.375em;line-height:1;left:-.86363636em}[role=banner]{margin-top:2.8125em;margin-bottom:1.875em}[role=contentinfo]{margin-top:2.8125em}.django-forms label{display:inline-block;margin-right:.3125em}.django-forms .helptext{display:block;font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400;font-size:.875em}.lt-ie9 .django-forms .helptext{font-style:normal!important}.django-forms input[type=email],.django-forms input[type=number],.django-forms input[type=search],.django-forms input[type=tel],.django-forms input[type=text],.django-forms input[type=url],.django-forms select,.django-forms textarea{display:block}.django-forms input[type=email]+.helptext,.django-forms input[type=number]+.helptext,.django-forms input[type=search]+.helptext,.django-forms input[type=tel]+.helptext,.django-forms input[type=text]+.helptext,.django-forms input[type=url]+.helptext,.django-forms select+.helptext,.django-forms textarea+.helptext{margin-top:.35714286em}.django-forms .errorlist{margin:0 0 .3125em;padding:0;list-style-type:none;color:#d12124;font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .django-forms .errorlist{font-style:normal!important}@font-face{font-family:extra-icons;src:url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg6SAyoAAAC8AAAAYGNtYXAaVcxXAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zk0tRP8AAAFwAAABnGhlYWQCr3NjAAADDAAAADZoaGVhBgsDxgAAA0QAAAAkaG10eARJAAAAAANoAAAAFGxvY2EAKADiAAADfAAAAAxtYXhwAAoAfwAAA4gAAAAgbmFtZUnnC+AAAAOoAAABYHBvc3QAAwAAAAAFCAAAACAAAwQAAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADmAAPA/8D/wAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIOYA//3//wAAAAAAIOYA//3//wAB/+MaBAADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAABAAAAAACSQNuABAAIQAyAHwAADc0JyYjIgcGFRQXFjMyNzY1ETQnJiMiBwYVFBcWMzI3NjUFNCcmIyIHBhUUFxYzMjc2NTMUBwYHBgcGBwYHBh0BFhcWFRQHBiMiJyY1NDc2NxEmJyY1NDc2MzIXFhUUBwYHETY3Njc2NzY3Njc2NzY1JicmNTQ3NjMyFxYVpRAQFxcQEBAQFxcQEBAQFxcQEBAQFxcQEAFtEBAXFhAQEBAWFxAQNw8PGQGAJ01JGBcZDw4gIC0uICAPDxkZDw8gIC4tICAODxkeOh8TEhYWDAwLCwUFGg4PICAtLiAgbhcQEBAQFxcQEBAQFwKSFxAQEBAXFxAQEBAXSRcQEBAQFxcQEBAQFx4ZGg6kSRUZFxESKA4PGRodLiAgICAuHRoZDwHUDhoZHi4gICAgLh4ZGg7+5A8SCQgHCgsMDBERFxYeDhoZHi4gICAgLgAAAAEAAAABAACjzOUxXw889QALBAAAAAAA0KQXfAAAAADQpBd8AAAAAAJJA24AAAAIAAIAAAAAAAAAAQAAA8D/wAAABAAAAAAAAkkAAQAAAAAAAAAAAAAAAAAAAAUAAAAAAAAAAAAAAAACAAAAAkkAAAAAAAAACgAUAB4AzgABAAAABQB9AAQAAAAAAAIAAAAAAAAAAAAAAAAAAAAAAAAADgCuAAEAAAAAAAEAFAAAAAEAAAAAAAIADgBcAAEAAAAAAAMAFAAqAAEAAAAAAAQAFABqAAEAAAAAAAUAFgAUAAEAAAAAAAYACgA+AAEAAAAAAAoANAB+AAMAAQQJAAEAFAAAAAMAAQQJAAIADgBcAAMAAQQJAAMAFAAqAAMAAQQJAAQAFABqAAMAAQQJAAUAFgAUAAMAAQQJAAYAFABIAAMAAQQJAAoANAB+AGUAeAB0AHIAYQAtAGkAYwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGUAeAB0AHIAYQAtAGkAYwBvAG5leHRyYS1pY29uAGUAeAB0AHIAYQAtAGkAYwBvAG4AUgBlAGcAdQBsAGEAcgBlAHgAdAByAGEALQBpAGMAbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('truetype'),url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAV0AAsAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABCAAAAGAAAABgDpIDKmNtYXAAAAFoAAAATAAAAEwaVcxXZ2FzcAAAAbQAAAAIAAAACAAAABBnbHlmAAABvAAAAZwAAAGcTS1E/2hlYWQAAANYAAAANgAAADYCr3NjaGhlYQAAA5AAAAAkAAAAJAYLA8ZobXR4AAADtAAAABQAAAAUBEkAAGxvY2EAAAPIAAAADAAAAAwAKADibWF4cAAAA9QAAAAgAAAAIAAKAH9uYW1lAAAD9AAAAWAAAAFgSecL4HBvc3QAAAVUAAAAIAAAACAAAwAAAAMEAAGQAAUAAAKZAswAAACPApkCzAAAAesAMwEJAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA5gADwP/A/8ADwABAAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDmAP/9//8AAAAAACDmAP/9//8AAf/jGgQAAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAQAAAAAAkkDbgAQACEAMgB8AAA3NCcmIyIHBhUUFxYzMjc2NRE0JyYjIgcGFRQXFjMyNzY1BTQnJiMiBwYVFBcWMzI3NjUzFAcGBwYHBgcGBwYdARYXFhUUBwYjIicmNTQ3NjcRJicmNTQ3NjMyFxYVFAcGBxE2NzY3Njc2NzY3Njc2NSYnJjU0NzYzMhcWFaUQEBcXEBAQEBcXEBAQEBcXEBAQEBcXEBABbRAQFxYQEBAQFhcQEDcPDxkBgCdNSRgXGQ8OICAtLiAgDw8ZGQ8PICAuLSAgDg8ZHjofExIWFgwMCwsFBRoODyAgLS4gIG4XEBAQEBcXEBAQEBcCkhcQEBAQFxcQEBAQF0kXEBAQEBcXEBAQEBceGRoOpEkVGRcREigODxkaHS4gICAgLh0aGQ8B1A4aGR4uICAgIC4eGRoO/uQPEgkIBwoLDAwRERcWHg4aGR4uICAgIC4AAAABAAAAAQAAo8zlMV8PPPUACwQAAAAAANCkF3wAAAAA0KQXfAAAAAACSQNuAAAACAACAAAAAAAAAAEAAAPA/8AAAAQAAAAAAAJJAAEAAAAAAAAAAAAAAAAAAAAFAAAAAAAAAAAAAAAAAgAAAAJJAAAAAAAAAAoAFAAeAM4AAQAAAAUAfQAEAAAAAAACAAAAAAAAAAAAAAAAAAAAAAAAAA4ArgABAAAAAAABABQAAAABAAAAAAACAA4AXAABAAAAAAADABQAKgABAAAAAAAEABQAagABAAAAAAAFABYAFAABAAAAAAAGAAoAPgABAAAAAAAKADQAfgADAAEECQABABQAAAADAAEECQACAA4AXAADAAEECQADABQAKgADAAEECQAEABQAagADAAEECQAFABYAFAADAAEECQAGABQASAADAAEECQAKADQAfgBlAHgAdAByAGEALQBpAGMAbwBuAFYAZQByAHMAaQBvAG4AIAAxAC4AMABlAHgAdAByAGEALQBpAGMAbwBuZXh0cmEtaWNvbgBlAHgAdAByAGEALQBpAGMAbwBuAFIAZQBnAHUAbABhAHIAZQB4AHQAcgBhAC0AaQBjAG8AbgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==) format('woff');font-weight:400;font-style:normal}.extra-icons{font-family:extra-icons;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.extra-icons-fork:before{content:"\e600"}@media only all and (min-width:37.5em){.code-demo-group{display:block;position:relative;margin-left:-15px;margin-right:-15px}}.code-demo-group_item{margin-bottom:30px}@media only all and (min-width:37.5em){.code-demo-group_item{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .code-demo-group_item{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}.code-demo{margin:0}.code-demo+.code-demo{padding-top:1.5em;margin-top:1.5em;border-top:1px solid #babbbd}.code-demo_caption{margin:1em 0}.masthead:after{content:"";display:table;clear:both}.lt-ie8 .masthead{zoom:1}.masthead_user{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.masthead_user em,.masthead_user i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .masthead_user em,.lt-ie9 .masthead_user i{font-style:normal!important}.masthead_user b,.masthead_user strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .masthead_user b,.lt-ie9 .masthead_user strong{font-weight:400!important}@media only all and (min-width:30em){.masthead_logo{margin:0;display:inline-block}.masthead_user{float:right;display:inline-block}}.user-meta{text-align:right}.user-meta_name{font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222;margin:0}.lt-ie9 .user-meta_name{font-weight:400!important}.user-meta_employee{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:.75em}.user-meta_employee em,.user-meta_employee i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .user-meta_employee em,.lt-ie9 .user-meta_employee i{font-style:normal!important}.user-meta_employee b,.user-meta_employee strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .user-meta_employee b,.lt-ie9 .user-meta_employee strong{font-weight:400!important}.user-meta_item{display:inline-block;margin:0;padding:0 1em;border-left:1px solid #e3e4e5;border-right:1px solid #e3e4e5;vertical-align:middle}.user-meta_item+.user-meta_item{margin-left:-.3125em}.user-meta_item__first{padding-left:0;border-left:0}.user-meta_item__last{padding-right:0;border-right:0}.meta{padding:1.875em 0;background:#f1f2f2;border-bottom:1px solid #e3e4e5}.meta:after{content:"";display:table;clear:both}.lt-ie8 .meta{zoom:1}.meta_breadcrumbs{margin-top:0}@media only all and (max-width:29.9375em){.meta_refresh .btn{display:block;width:100%}}@media only all and (min-width:30em){.meta_left{float:left}.meta_right{float:right}.meta_breadcrumbs{margin:0}.meta_btn{margin-top:-.5em}}.intro_text{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:2.125em;line-height:1.29411765;max-width:20em;margin-bottom:1.17647059em}.intro_text em,.intro_text i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .intro_text em,.lt-ie9 .intro_text i{font-style:normal!important}.intro_text b,.intro_text strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .intro_text b,.lt-ie9 .intro_text strong{font-weight:400!important}@media only all and (max-width:37.4375em){.intro_text{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.73076923em;font-size:1.625em;line-height:1.26923077}.intro_text em,.intro_text i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .intro_text em,.lt-ie9 .intro_text i{font-style:normal!important}.intro_text b,.intro_text strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .intro_text b,.lt-ie9 .intro_text strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.intro_text{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;margin-bottom:.95454545em;font-size:1.375em;line-height:1.27272727}.intro_text em,.intro_text i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .intro_text em,.lt-ie9 .intro_text i{font-style:normal!important}.intro_text b,.intro_text strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .intro_text b,.lt-ie9 .intro_text strong{font-weight:400!important}}@media only all and (max-width:37.4375em) and only all and (max-width:37.4375em) and only all and (max-width:37.4375em){.intro_text{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .intro_text{font-weight:400!important}}@media only all and (min-width:64em){.tile_container{display:block;position:relative;margin-left:-15px;margin-right:-15px}.tile_container .tile{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .tile_container .tile{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}.user-role{display:inline-block;font-size:.75em;line-height:1}.user-role+.user-role{margin-left:.66666667em}.user-role_resource{font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500}.lt-ie9 .user-role_resource{font-weight:400!important}.user-role_role{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400}.user-role_role em,.user-role_role i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .user-role_role em,.lt-ie9 .user-role_role i{font-style:normal!important}.user-role_role b,.user-role_role strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .user-role_role b,.lt-ie9 .user-role_role strong{font-weight:400!important}.btn__block{box-sizing:border-box;display:block;width:100%;text-align:center}.expandable__no-margin-on-expand.expandable__expanded{margin-bottom:0}.expandable_target:focus{outline:1px dotted #75787b;outline-offset:1px}.expandable_label-icon{margin-right:.25em}.expandable_content__teams{padding-top:1.875em}.expandable__team{position:relative;margin-bottom:0;border:1px solid #e3e4e5}.expandable__team.expandable__expanded,.expandable__team:hover{background:#f1f2f2}.expandable__team .expandable_header{padding:1em}.expandable__team .expandable_label{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;margin-top:0;font-size:1.375em;margin-bottom:.40909091em;line-height:1}.expandable__team .expandable_label em,.expandable__team .expandable_label i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .expandable__team .expandable_label em,.lt-ie9 .expandable__team .expandable_label i{font-style:normal!important}.expandable__team .expandable_label b,.expandable__team .expandable_label strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .expandable__team .expandable_label b,.lt-ie9 .expandable__team .expandable_label strong{font-weight:400!important}@media only all and (max-width:37.4375em){.expandable__team .expandable_label{margin-top:0;margin-bottom:1.16666667em;font-size:1.125em;font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;line-height:1.22222222}.lt-ie9 .expandable__team .expandable_label{font-weight:400!important}}.expandable__team .expandable_role{position:absolute;top:0;right:0}.expandable__team .expandable_actions{line-height:1}.expandable__team .expandable_actions:after{content:"";display:table;clear:both}.lt-ie8 .expandable__team .expandable_actions{zoom:1}.expandable__team .expandable_content{margin-bottom:1em}.expandable__team .expandable_content:before{height:0;margin-bottom:.3125em}.corner-badge{display:inline-block;padding:.25em .375em;border-bottom-left-radius:4px;background:#e3e4e5;color:#101820;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;line-height:1}.corner-badge em,.corner-badge i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .corner-badge em,.lt-ie9 .corner-badge i{font-style:normal!important}.corner-badge b,.corner-badge strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .corner-badge b,.lt-ie9 .corner-badge strong{font-weight:400!important}.corner-badge__user:before{font-family:'CFPB Minicons';display:inline-block;font-style:normal;font-weight:400;line-height:1;-webkit-font-smoothing:antialiased;content:"\e600";margin-right:.33333333em;font-size:.875em}.corner-badge__hide{display:none}.corner-badge__bg-green{background-color:#addc91}.corner-badge_label{font-size:.75em}.slats{margin:0;padding:0;border:1px solid #e3e4e5;background:#fff;list-style-type:none}.slats_item+.slats_item{border-top:1px dotted #e3e4e5}.slats-header{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:.875em;line-height:1.57142857;line-height:1;margin:0;padding:1.14285714em;border:1px solid #e3e4e5;background:#e3e4e5}.lt-ie9 .slats-header{font-weight:400!important}.slats-header__add{border-color:#addc91;background:#addc91;color:#101820}.slats-header+.slats,.slats-header+.slats-type{border-top:0}.slats-type{display:block;margin:0;border:1px solid #e3e4e5;background:#fff}.slats-type_input,.slats-type_input[type=text]{box-sizing:border-box;width:100%;margin:0;padding:.875em;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:1em;border-color:transparent}.slats-type_input em,.slats-type_input i,.slats-type_input[type=text] em,.slats-type_input[type=text] i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .slats-type_input em,.lt-ie9 .slats-type_input i,.lt-ie9 .slats-type_input[type=text] em,.lt-ie9 .slats-type_input[type=text] i{font-style:normal!important}.slats-type_input b,.slats-type_input strong,.slats-type_input[type=text] b,.slats-type_input[type=text] strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .slats-type_input b,.lt-ie9 .slats-type_input strong,.lt-ie9 .slats-type_input[type=text] b,.lt-ie9 .slats-type_input[type=text] strong{font-weight:400!important}.slats-type+.slats{margin-top:-1px}.slat{padding:1em}.slat:after{content:"";display:table;clear:both}.lt-ie8 .slat{zoom:1}.slat__bg-info{background:#cce3f5}.slat__bg-warning{background:#f6d9d3}.slat__has-roles{position:relative}.slat__hide{display:none}.slat_roles{position:absolute;top:-1px;right:0}.slat_label{font-family:AvenirNextLTW01-Medium,Arial,sans-serif;font-style:normal;font-weight:500;font-size:1.125em;line-height:1}.lt-ie9 .slat_label{font-weight:400!important}.slat_label+.slat_label{margin-left:.44444444em}.slat_label-regular{font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:1em}.slat_label-regular em,.slat_label-regular i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .slat_label-regular em,.lt-ie9 .slat_label-regular i{font-style:normal!important}.slat_label-regular b,.slat_label-regular strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .slat_label-regular b,.lt-ie9 .slat_label-regular strong{font-weight:400!important}.slat_label-small{color:#75787b;font-family:AvenirNextLTW01-Regular,Arial,sans-serif;font-style:normal;font-weight:400;font-size:.66666667em;line-height:1}.slat_label-small em,.slat_label-small i{font-family:AvenirNextLTW01-Italic,Arial,sans-serif;font-style:italic;font-weight:400}.lt-ie9 .slat_label-small em,.lt-ie9 .slat_label-small i{font-style:normal!important}.slat_label-small b,.slat_label-small strong{font-family:AvenirNextLTW01-Demi,Arial,sans-serif;font-style:normal;font-weight:700}.lt-ie9 .slat_label-small b,.lt-ie9 .slat_label-small strong{font-weight:400!important}.slat_btn__link{margin-top:0;margin-bottom:0}.slat_icon-btn{display:inline-block;margin:-.42857143em .42857143em;padding:.42857143em;border:0;background:0 0;color:#0072ce;font-size:.875em;line-height:1.28571429}.slat_icon-btn:focus,.slat_icon-btn:hover{outline:1px dotted #0072ce}.slat_icon-btn+.slat_icon-btn,.slat_icon-btn__first{margin-left:-.42857143em}.slat_icon-btn__last{margin-right:-.42857143em}.slat_icon-btn__add{color:#2cb34a}.slat_icon-btn__add:focus,.slat_icon-btn__add:hover{color:#2cb34a;outline-color:#2cb34a}.slat_icon-btn__remove{color:#d12124}.slat_icon-btn__remove:focus,.slat_icon-btn__remove:hover{color:#d12124;outline-color:#d12124}.slat_left{float:left}.slat_right{float:right}.slat-l{display:block;position:relative;margin-left:-15px;margin-right:-15px}.slat-l_col-1-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%}.lt-ie8 .slat-l_col-1-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}.slat-l_col-2-3{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:66.66666667%}.lt-ie8 .slat-l_col-2-3{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}@media only all and (min-width:48em){.teams{display:block;position:relative;margin-left:-15px;margin-right:-15px}}.teams_item{margin-bottom:30px}@media only all and (min-width:48em){.teams_item{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .teams_item{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}[ng-repeat].teams_item{margin-right:0}}@media only all and (min-width:64em){.teams_item{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:33.33333333%}.lt-ie8 .teams_item{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}[ng-repeat].teams_item{margin-right:0}}.team-content_item+.team-content_item{margin-top:1em;margin-top:1rem}@media only all and (min-width:48em){.team-admin-content{display:block;position:relative;margin-left:-15px;margin-right:-15px}}@media only all and (min-width:48em){.team-admin-content_item{display:inline-block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border:solid transparent;border-width:0 15px;margin-right:-.25em;vertical-align:top;width:50%}.lt-ie8 .team-admin-content_item{display:inline;margin-right:0;zoom:1;behavior:url(/static/vendor/box-sizing-polyfill/boxsizing.htc)}}.assetbutton,.userbutton{margin:0}.userbutton{margin-right:.42857143em;padding-right:1px} \ No newline at end of file diff --git a/src/index.html b/src/index.html index bf1f989..d869e61 100644 --- a/src/index.html +++ b/src/index.html @@ -4,6 +4,9 @@ Dash + + + diff --git a/src/js/components/TeamPage.jsx b/src/js/components/TeamPage.jsx index 082357c..584ac31 100644 --- a/src/js/components/TeamPage.jsx +++ b/src/js/components/TeamPage.jsx @@ -38,7 +38,6 @@ var TeamPage = React.createClass({ var isInProgress = false; if (teamDetails) { - console.log('model fetching?', teamDetails.fetchInProgress) isInProgress = teamDetails.fetchInProgress; } var Members = _.map(allMembers, function(members, roleName){ diff --git a/src/js/utils/__tests__/common-test.js b/src/js/utils/__tests__/common-test.js index 9379416..3b0faab 100644 --- a/src/js/utils/__tests__/common-test.js +++ b/src/js/utils/__tests__/common-test.js @@ -1,10 +1,11 @@ jest.dontMock('../../utils/common'); -var common, resources, $; +var common, resources, $, userId; beforeEach(function(){ common = require('../../utils/common'); resources = require('../../utils/resources'); $ = require('jquery'); + userId = '123'; }); @@ -20,7 +21,7 @@ describe('User and team functions/actions', function(){ it('should call the correct routes when user actions are invoked', function(){ var opts = {'foo': 'boo'}; - var userId = '123' + common.getAllUsers(); expect($.get).toBeCalledWith(resources.routes.ALL_USERS); @@ -53,26 +54,23 @@ describe('User and team functions/actions', function(){ describe('User manipulations', function(){ it('should deactivate user', function(){ resources.routes = { - userActions: function(userId){ - return '/kratos/users/'+userId + userActions: function(user){ + return '/kratos/users/' + userId } }; - var userId = '123' common.deactivateUser(userId); - expect($.ajax.mock.calls[0][0].url).toBe('/kratos/users/'+userId); + expect($.ajax.mock.calls[0][0].url).toBe('/kratos/users/' + userId); expect($.ajax.mock.calls[0][0].type).toEqual('DELETE'); }); it('should reactivate user', function(){ resources.routes = { - userActions: function(userId){ - return '/kratos/users/'+userId + userActions: function(user){ + return '/kratos/users/' + userId } }; - - var userId = '123' common.reactivateUser(userId); - expect($.ajax.mock.calls[0][0].url).toBe('/kratos/users/'+userId); + expect($.ajax.mock.calls[0][0].url).toBe('/kratos/users/' + userId); expect($.ajax.mock.calls[0][0].type).toEqual('PUT'); });