avvo-styleguide/dist/debug.css

Avvo styleguide

@charset "UTF-8";.page-row::before{content:"⚠ERROR: " "`.page-row` is deprecated. Use `.row` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.page::before{content:"⚠ERROR: " "`.page` is deprecated. Use `.container` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.full-width::before{content:"⚠ERROR: " "`.full-width` is deprecated. Please check the UI Kit documentation for an alternative.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero2::before{content:"⚠ERROR: " "`.hero2` is deprecated. Use `.hero-large` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero1::before{content:"⚠ERROR: " "`.hero1` is deprecated. Use `.hero-larger` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.jumbo::before{content:"⚠ERROR: " "`.jumbo` is deprecated. Use `.hero-largest` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero-largest::before{content:"⚠ERROR: " "`.hero-largest` is deprecated. Use `.hero-heading` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero-larger::before{content:"⚠ERROR: " "`.hero-larger` is deprecated. Use `.hero-heading` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero-large::before{content:"⚠ERROR: " "`.hero-large` is deprecated. Use `.hero-heading` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}i.icon::before{content:"⚠ERROR: " "`i.icon` is deprecated. Use the `icon` helper instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.jumbotron::before{content:"⚠ERROR: " "`.jumbotron` is deprecated. Please check the UI Kit documentation for an alternative.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.light::before{content:"⚠ERROR: " "`.light` is deprecated. Please check the UI Kit documentation for an alternative.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.u-bg-light-blue::before{content:"⚠ERROR: " "`.u-bg-light-blue` is deprecated. Use `.u-bg-electric-blue` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.u-text-color-light-blue::before{content:"⚠ERROR: " "`.u-text-color-light-blue` is deprecated. Use `.u-text-color-electric-blue` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.u-vertical-padding-gutter::before{content:"⚠ERROR: " "`.u-vertical-padding-gutter` is deprecated. Use `.u-vertical-padding-half` instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.alert:not(.alert-dismissible) .close::before{content:"⚠ERROR: " "`.alert` requires the `.alert-dismissible` class if it contains a `.close` button";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.alert:not([role*=alert])::before{content:"⚠ERROR: " '`.alert` requires a `role="alert"` attribute';display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.btn-danger:not(.btn)::before,.btn-default:not(.btn)::before,.btn-link:not(.btn)::before,.btn-outline:not(.btn)::before,.btn-primary:not(.btn)::before,.btn-secondary:not(.btn)::before,.btn-success:not(.btn)::before{content:"⚠ERROR: " "Missing the `.btn` class";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.btn.btn[class*=" col-"]::before,.btn.btn[class^=col-]::before{content:"⚠ERROR: " "Don’t use `.col-` classes directly on `.btn`. Instead, add `.btn-block` to your button and nest it within a `.col-`.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.card>[class^=col-]::before{content:"⚠ERROR: " "Columns inside `.card`s need to be wrapped within a `.row` or `.clearfix` element";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.card-cells .card:not([class*=col-])::before{content:"⚠ERROR: " "Card-cell `.card`s require a `.col-` class";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.card-cells>[class*=" col-"]::before,.card-cells>[class^=col-]::before{content:"⚠ERROR: " "Columns inside `.card-cell`s need to be wrapped within a `.row`";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.circular-not-loaded::before,.proxima-not-loaded::before{content:"⚠ERROR: " "Web fonts were not properly loaded. Check that Avvo UI’s font loader JavaScript is loaded correctly.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}@-webkit-keyframes delayed-appearance{from{top:-100px}to{top:10px}}@keyframes delayed-appearance{from{top:-100px}to{top:10px}}.circular-not-loaded::before,.proxima-not-loaded::before{position:fixed;top:-100px;left:24%;width:52%;z-index:9000;-webkit-animation:delayed-appearance .4s 5s forwards;animation:delayed-appearance .4s 5s forwards;font-size:14px}[class*=u-font-weight-]::before{content:"⚠ERROR: " "`.u-font-weight-{x}` is deprecated, please remove the class or use `.strong`.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.container .container::before{content:"⚠ERROR: " "`.container`s cannot be nested within each other";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.container>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,.container>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,.container>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,.container>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,.container>:not(.row)>:not(.row)>[class*=" col-"]::before,.container>:not(.row)>:not(.row)>[class^=col-]::before,.container>:not(.row)>[class*=" col-"]::before,.container>:not(.row)>[class^=col-]::before,.container>[class*=" col-"]::before,.container>[class^=col-]::before,[class*=" col-"]>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,[class*=" col-"]>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,[class*=" col-"]>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,[class*=" col-"]>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,[class*=" col-"]>:not(.row)>:not(.row)>[class*=" col-"]::before,[class*=" col-"]>:not(.row)>:not(.row)>[class^=col-]::before,[class*=" col-"]>:not(.row)>[class*=" col-"]::before,[class*=" col-"]>:not(.row)>[class^=col-]::before,[class*=" col-"]>[class*=" col-"]::before,[class*=" col-"]>[class^=col-]::before,[class^=col-]>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,[class^=col-]>:not(.row)>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,[class^=col-]>:not(.row)>:not(.row)>:not(.row)>[class*=" col-"]::before,[class^=col-]>:not(.row)>:not(.row)>:not(.row)>[class^=col-]::before,[class^=col-]>:not(.row)>:not(.row)>[class*=" col-"]::before,[class^=col-]>:not(.row)>:not(.row)>[class^=col-]::before,[class^=col-]>:not(.row)>[class*=" col-"]::before,[class^=col-]>:not(.row)>[class^=col-]::before,[class^=col-]>[class*=" col-"]::before,[class^=col-]>[class^=col-]::before{content:"⚠ERROR: " "Columns (`.col-`) need a `.row` parent class. Don’t nest columns within columns.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.form-horizontal .form-group:not(.row)::before{content:"⚠ERROR: " "A `.form-group` within a `.form-horizontal` must have a `.row` class to display properly.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}h1.strong::before,h2.strong::before,h3.strong::before,h4.strong::before,h5.strong::before,h6.strong::before{content:"⚠ERROR: " "For design consistency, all headings must use their default font weight. Please remove the `.strong` class.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}h1 .strong::before,h1 b::before,h1 em::before,h1 i::before,h1 strong::before,h2 .strong::before,h2 b::before,h2 em::before,h2 i::before,h2 strong::before,h3 .strong::before,h3 b::before,h3 em::before,h3 i::before,h3 strong::before,h4 .strong::before,h4 b::before,h4 em::before,h4 i::before,h4 strong::before,h5 .strong::before,h5 b::before,h5 em::before,h5 i::before,h5 strong::before,h6 .strong::before,h6 b::before,h6 em::before,h6 i::before,h6 strong::before{content:"⚠ERROR: " "For design consistency, `strong`, `em`, and other font-style tags are no longer supported in headings.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}h1[class*=u-font-size-]::before,h2[class*=u-font-size-]::before,h3[class*=u-font-size-]::before,h4[class*=u-font-size-]::before,h5[class*=u-font-size-]::before,h6[class*=u-font-size-]::before{content:"⚠ERROR: " "For design consistency, you must use an existing heading size. Please remove the `.u-font-size-x` class and try a different heading class to change size.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.h1.hero-heading::before,.h2.hero-heading::before,.h3.hero-heading::before,.h4.hero-heading::before,.h5.hero-heading::before,.h6.hero-heading::before{content:"⚠ERROR: " "`.hero-heading` can not be combined with a `.h1`-`.h6` class. Please choose a single heading class.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.hero-heading+.lead::before{content:"⚠ERROR: " "Please use `.hero-text` instead of `.lead` when pairing text with a `.hero-heading`.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.icon-user::after{content:"⚠ERROR: " "The “user” icon is deprecated; use “person” instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.icon-close::after{content:"⚠ERROR: " "The “close” icon is deprecated; use “x” instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.icon-close-circled::after{content:"⚠ERROR: " "The “close-circled” icon is deprecated; use “x-circled” instead.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.clearfix[class*=u-vertical-padding-]::before,.row[class*=u-vertical-padding-]::before{content:"⚠ERROR: " "`u-vertical-padding-X` can not be combined with `.row` or `.clearfix`";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}.pull-left+[class*=u-vertical-padding-]::before,.pull-right+[class*=u-vertical-padding-]::before{content:"⚠ERROR: " "`u-vertical-padding-X` doesn’t render correctly in some browsers when following a `.pull-left` or `.pull-right`. You can fix it by nesting inside an empty div or other element.";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}[class*=text-columns-]:not(.text-columns)::before{content:"⚠ERROR: " "`" attr(class) "` requires the `.text-columns` class";display:inline-block;background:red;padding:.5em 1em;margin:.5em;border:1px solid #8b0000;color:#fff;font-size:1.2rem}