intake/static/intake/css/cfa.css
/* Vendor */
/* stylelint-disable order/properties-alphabetical-order */
/* stylelint-enable */
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
}
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */
/**
* 1. Change the default font family in all browsers (opinionated).
* 2. Prevent adjustments of font size after orientation changes in IE and iOS.
*/
html {
font-family: sans-serif;
/* 1 */
-ms-text-size-adjust: 100%;
/* 2 */
-webkit-text-size-adjust: 100%;
/* 2 */
}
/**
* Remove the margin in all browsers (opinionated).
*/
body {
margin: 0;
}
/* HTML5 display definitions
========================================================================== */
/**
* Add the correct display in IE 9-.
* 1. Add the correct display in Edge, IE, and Firefox.
* 2. Add the correct display in IE.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
/* 1 */
display: block;
}
/**
* Add the correct display in IE 9-.
*/
audio,
canvas,
progress,
video {
display: inline-block;
}
/**
* Add the correct display in iOS 4-7.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Add the correct display in IE 10-.
* 1. Add the correct display in IE.
*/
template,
[hidden] {
display: none;
}
/* Links
========================================================================== */
/**
* 1. Remove the gray background on active links in IE 10.
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
*/
a {
background-color: transparent;
/* 1 */
-webkit-text-decoration-skip: objects;
/* 2 */
}
/**
* Remove the outline on focused links when they are also active or hovered
* in all browsers (opinionated).
*/
a:active,
a:hover {
outline-width: 0;
}
/* Text-level semantics
========================================================================== */
/**
* 1. Remove the bottom border in Firefox 39-.
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none;
/* 1 */
text-decoration: underline;
/* 2 */
text-decoration: underline dotted;
/* 2 */
}
/**
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
*/
b,
strong {
font-weight: inherit;
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* Add the correct font style in Android 4.3-.
*/
dfn {
font-style: italic;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Add the correct background and color in IE 9-.
*/
mark {
background-color: #ff0;
color: #000;
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10-.
*/
img {
border-style: none;
}
/**
* Hide the overflow in IE.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
/* 1 */
font-size: 1em;
/* 2 */
}
/**
* Add the correct margin in IE 8.
*/
figure {
margin: 1em 40px;
}
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box;
/* 1 */
height: 0;
/* 1 */
overflow: visible;
/* 2 */
}
/* Forms
========================================================================== */
/**
* 1. Change font properties to `inherit` in all browsers (opinionated).
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
select,
textarea {
font: inherit;
/* 1 */
margin: 0;
/* 2 */
}
/**
* Restore the font weight unset by the previous rule.
*/
optgroup {
font-weight: bold;
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input {
/* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select {
/* 1 */
text-transform: none;
}
/**
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
* controls in Android 4.
* 2. Correct the inability to style clickable types in iOS and Safari.
*/
button,
html [type=button],
[type=reset],
[type=submit] {
-webkit-appearance: button;
/* 2 */
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Change the border, margin, and padding in all browsers (opinionated).
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box;
/* 1 */
color: inherit;
/* 2 */
display: table;
/* 1 */
max-width: 100%;
/* 1 */
padding: 0;
/* 3 */
white-space: normal;
/* 1 */
}
/**
* Remove the default vertical scrollbar in IE.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10-.
* 2. Remove the padding in IE 10-.
*/
[type=checkbox],
[type=radio] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type=search] {
-webkit-appearance: textfield;
/* 1 */
outline-offset: -2px;
/* 2 */
}
/**
* Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
*/
[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Correct the text style of placeholders in Chrome, Edge, and Safari.
*/
::-webkit-input-placeholder {
color: inherit;
opacity: 0.54;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button;
/* 1 */
font: inherit;
/* 2 */
}
/* Atoms */
.grid {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
max-width: 960px;
}
.grid::after {
clear: both;
content: "";
display: block;
}
@media screen and (min-width: 961px) {
.grid .width-one-whole {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 100%;
}
.grid .width-one-whole:last-child {
margin-right: 0;
}
.grid .width-one-half {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 48.8211739883%;
}
.grid .width-one-half:last-child {
margin-right: 0;
}
.grid .width-one-third {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 31.7615653177%;
}
.grid .width-one-third:last-child {
margin-right: 0;
}
.grid .width-two-thirds {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 65.8807826589%;
}
.grid .width-two-thirds:last-child {
margin-right: 0;
}
.grid .width-one-fourth {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 23.2317609825%;
}
.grid .width-one-fourth:last-child {
margin-right: 0;
}
.grid .width-three-fourths {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 74.4105869942%;
}
.grid .width-three-fourths:last-child {
margin-right: 0;
}
.grid .width-one-sixth {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 14.7019566472%;
}
.grid .width-one-sixth:last-child {
margin-right: 0;
}
.grid .width-five-sixths {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 82.9403913294%;
}
.grid .width-five-sixths:last-child {
margin-right: 0;
}
.grid .width-one-twelfth {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 6.1721523119%;
}
.grid .width-one-twelfth:last-child {
margin-right: 0;
}
.grid .width-five-twelfths {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 40.291369653%;
}
.grid .width-five-twelfths:last-child {
margin-right: 0;
}
.grid .width-seven-twelfths {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 57.3509783236%;
}
.grid .width-seven-twelfths:last-child {
margin-right: 0;
}
.grid .width-eleven-twelfths {
float: left;
display: block;
margin-right: 2.3576520234%;
width: 91.4701956647%;
}
.grid .width-eleven-twelfths:last-child {
margin-right: 0;
}
.grid .shift-one-half {
margin-left: 51.1788260117%;
}
.grid .shift-one-third {
margin-left: 34.1192173411%;
}
.grid .shift-two-thirds {
margin-left: 68.2384346823%;
}
.grid .shift-one-fourth {
margin-left: 25.5894130058%;
}
.grid .shift-three-fourths {
margin-left: 76.7682390175%;
}
.grid .shift-one-sixth {
margin-left: 17.0596086706%;
}
.grid .shift-five-sixths {
margin-left: 85.2980433528%;
}
.grid .shift-one-twelfth {
margin-left: 8.5298043353%;
}
.grid .shift-five-twelfths {
margin-left: 42.6490216764%;
}
.grid .shift-seven-twelfths {
margin-left: 59.708630347%;
}
.grid .shift-eleven-twelfths {
margin-left: 93.8278476881%;
}
.grid .end-row {
margin-right: 0;
}
.grid .end-row + .grid__item {
clear: left;
}
}
* {
box-sizing: border-box;
}
html {
position: relative;
background-color: #FAFAF9;
font-size: 10px;
-webkit-font-smoothing: antialiased;
min-height: 100%;
}
body {
font-size: 19px;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
line-height: 1.5em;
margin: 0;
}
.page-wrapper {
overflow: hidden;
padding-left: 20px;
padding-right: 20px;
}
@media screen and (min-width: 961px) {
.page-wrapper {
padding-left: 40px;
padding-right: 40px;
}
}
.is-mobile-hidden {
display: none !important;
}
@media screen and (min-width: 961px) {
.is-mobile-hidden {
display: block !important;
}
}
.is-mobile-hidden--inline {
display: none !important;
}
@media screen and (min-width: 961px) {
.is-mobile-hidden--inline {
display: inline-block !important;
}
}
.with-no-padding {
margin-bottom: 0 !important;
}
.with-padding-small {
margin-bottom: 1rem !important;
}
.with-padding-med {
margin-bottom: 3.8rem !important;
}
.with-padding-large {
margin-bottom: 7.6rem !important;
}
.with-padding-huge {
margin-bottom: 15.2rem !important;
}
@media screen and (min-width: 961px) {
.with-non-mobile-top-padding-small {
margin-top: 1rem !important;
}
}
@media screen and (min-width: 961px) {
.with-non-mobile-top-padding-med {
margin-top: 3.8rem !important;
}
}
@media screen and (min-width: 961px) {
.with-non-mobile-top-padding-large {
margin-top: 7.6rem !important;
}
}
@media screen and (min-width: 961px) {
.with-non-mobile-top-padding-huge {
margin-top: 15.2rem !important;
}
}
@media screen and (min-width: 961px) {
.with-neg-padding-large {
margin-bottom: -15.2rem !important;
}
}
.nudge--tiny {
margin-top: 0.2em !important;
}
.nudge--small {
margin-top: 0.5em !important;
}
.nudge--med {
margin-top: 0.7em !important;
}
.nudge--large {
margin-top: 7.6rem !important;
}
.nudge--huge {
margin-top: 15.2rem !important;
}
p {
margin-top: 0;
margin-bottom: 1em;
}
h1, .h1, .statistic-card__number {
font-size: 36px;
line-height: 1.3em;
font-weight: 600;
margin-top: 1.5em;
margin-bottom: 0.5em;
}
h1:first-child, .h1:first-child, .statistic-card__number:first-child {
margin-top: 0em;
}
h2, .h2 {
font-size: 28px;
font-weight: 600;
line-height: 1.3em;
margin-top: 1.5em;
margin-bottom: 0.5em;
}
h2:first-child, .h2:first-child {
margin-top: 0em;
}
h3, .h3 {
font-size: 24px;
font-weight: 300;
line-height: 1.5em;
margin-top: 1.5em;
margin-bottom: 0.5em;
}
h3:first-child, .h3:first-child {
margin-top: 0em;
}
h4, .h4 {
font-size: 19px;
font-weight: 600;
line-height: 1.3em;
margin-top: 1.5em;
margin-bottom: 0.5em;
}
h4:first-child, .h4:first-child {
margin-top: 0em;
}
a {
color: #069ed6;
}
a:hover {
color: #057eab;
}
.link--subtle {
color: inherit;
}
.text--small {
font-size: 16px;
line-height: 1.5em;
}
.text--caps {
font-size: 0.8em;
text-transform: uppercase;
letter-spacing: 1px;
font-weight: 500;
line-height: 1.5em;
}
.text--centered {
text-align: center;
}
.text--right {
text-align: right;
}
ol, ul {
list-style: none;
padding-left: 0;
}
.text--help, .statistic-card__label, .data-table th, .summary-table__label {
font-size: 16px;
line-height: 1.5em;
color: #666666;
}
.text--warning {
font-size: 16px;
line-height: 1.5em;
color: #D48C00;
}
.text--error {
font-size: 16px;
line-height: 1.5em;
color: #D40000;
}
.text--pullquote, .summary-table__value {
font-weight: 300;
font-size: 24px;
line-height: 1.5em;
margin-bottom: 0.5em;
}
.text--teal {
color: #069ed6;
}
.list--padded li {
margin-bottom: 1em;
}
.list--bulleted {
list-style: disc;
padding-left: 2.5em;
}
.list--bulleted li {
margin-bottom: 0.5em;
}
.list--numbered {
list-style: decimal;
padding-left: 2.5em;
}
.list--numbered li {
margin-bottom: 0.5em;
}
table {
margin-bottom: 1em;
}
td {
padding-right: 1em;
}
.label {
display: inline-block;
font-size: 12px;
background-color: #666666;
color: #fff;
font-weight: 500;
border-radius: 2px;
text-transform: uppercase;
padding: 0 0.5em;
line-height: 1.4em;
position: relative;
top: -0.1em;
margin-left: 0.2em;
}
.label--magenta {
background-color: #A6005E;
}
.label--teal {
background-color: #069ed6;
}
.label--green {
background-color: #43AE74;
}
.label--orange {
background-color: #D48C00;
}
.label--red {
background-color: #D40000;
}
[class^=icon-], [class*=" icon-"] {
line-height: 1.5em;
position: relative;
}
.icon-arrow_forward {
top: 0.15em;
}
.icon-keyboard_arrow_left {
top: 0.15em;
}
.icon-keyboard_arrow_right {
top: 0.15em;
}
.icon-arrow_back {
top: 0.15em;
}
.icon-insert_comment {
top: 0.1em;
}
.icon-file_upload {
top: 0.15em;
}
.icon-person {
top: 0.1em;
}
.icon-people {
top: 0.15em;
}
.icon-replay {
top: 0.1em;
}
.icon-add {
top: 0.1em;
}
.icon-control_point {
top: 0.1em;
}
.icon-info {
top: 0.1em;
}
@font-face {
font-family: "icomoon";
src: url("/static/intake/icomoon/icomoon.eot?ia7soh");
src: url("/static/intake/icomoon/icomoon.eot?ia7soh#iefix") format("embedded-opentype"), url("/static/intake/icomoon/icomoon.ttf?ia7soh") format("truetype"), url("/static/intake/icomoon/icomoon.woff?ia7soh") format("woff"), url("/static/intake/icomoon/icomoon.svg?ia7soh#icomoon") format("svg");
font-weight: normal;
font-style: normal;
}
[class^=icon-], [class*=" icon-"] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-add:before {
content: "\e145";
}
.icon-add_a_photo:before {
content: "\e439";
}
.icon-add_circle:before {
content: "\e147";
}
.icon-control_point:before {
content: "\e3ba";
}
.icon-arrow_back:before {
content: "\e5c4";
}
.icon-arrow_downward:before {
content: "\e5db";
}
.icon-arrow_drop_down:before {
content: "\e5c5";
}
.icon-arrow_drop_up:before {
content: "\e5c7";
}
.icon-arrow_forward:before {
content: "\e5c8";
}
.icon-arrow_upward:before {
content: "\e5d8";
}
.icon-call_made:before {
content: "\e0b2";
}
.icon-call_received:before {
content: "\e0b5";
}
.icon-cancel:before {
content: "\e5c9";
}
.icon-check:before {
content: "\e5ca";
}
.icon-check_box:before {
content: "\e834";
}
.icon-check_box_outline_blank:before {
content: "\e835";
}
.icon-check_circle:before {
content: "\e86c";
}
.icon-navigate_before:before {
content: "\e408";
}
.icon-navigate_next:before {
content: "\e409";
}
.icon-close:before {
content: "\e5cd";
}
.icon-mode_edit:before {
content: "\e254";
}
.icon-delete:before {
content: "\e872";
}
.icon-delete_forever:before {
content: "\e92b";
}
.icon-done:before {
content: "\e876";
}
.icon-done_all:before {
content: "\e877";
}
.icon-time_to_leave:before {
content: "\e62c";
}
.icon-markunread:before {
content: "\e159";
}
.icon-expand_less:before {
content: "\e5ce";
}
.icon-favorite:before {
content: "\e87d";
}
.icon-favorite_border:before {
content: "\e87e";
}
.icon-get_app:before {
content: "\e884";
}
.icon-file_upload:before {
content: "\e2c6";
}
.icon-people:before {
content: "\e7fb";
}
.icon-group_add:before {
content: "\e7f0";
}
.icon-help:before {
content: "\e887";
}
.icon-help_outline:before {
content: "\e8fd";
}
.icon-highlight_off:before {
content: "\e888";
}
.icon-photo:before {
content: "\e410";
}
.icon-info:before {
content: "\e88e";
}
.icon-info_outline:before {
content: "\e88f";
}
.icon-insert_comment:before {
content: "\e24c";
}
.icon-tag_faces:before {
content: "\e420";
}
.icon-keyboard_arrow_down:before {
content: "\e313";
}
.icon-keyboard_arrow_left:before {
content: "\e314";
}
.icon-keyboard_arrow_right:before {
content: "\e315";
}
.icon-keyboard_arrow_up:before {
content: "\e316";
}
.icon-keyboard_backspace:before {
content: "\e317";
}
.icon-language:before {
content: "\e894";
}
.icon-room:before {
content: "\e8b4";
}
.icon-lock_open:before {
content: "\e898";
}
.icon-lock_outline:before {
content: "\e899";
}
.icon-mood_bad:before {
content: "\e7f3";
}
.icon-move_to_inbox:before {
content: "\e168";
}
.icon-no_encryption:before {
content: "\e641";
}
.icon-notifications:before {
content: "\e7f4";
}
.icon-notifications_active:before {
content: "\e7f7";
}
.icon-notifications_off:before {
content: "\e7f6";
}
.icon-person:before {
content: "\e7fd";
}
.icon-person_add:before {
content: "\e7fe";
}
.icon-phone_in_talk:before {
content: "\e61d";
}
.icon-phone_iphone:before {
content: "\e325";
}
.icon-visibility:before {
content: "\e8f4";
}
.icon-replay:before {
content: "\e042";
}
.icon-report:before {
content: "\e160";
}
.icon-warning:before {
content: "\e002";
}
.icon-sentiment_dissatisfied:before {
content: "\e811";
}
.icon-sentiment_neutral:before {
content: "\e812";
}
.icon-sentiment_satisfied:before {
content: "\e813";
}
.icon-sentiment_very_dissatisfied:before {
content: "\e814";
}
.icon-sentiment_very_satisfied:before {
content: "\e815";
}
.icon-settings:before {
content: "\e8b8";
}
.icon-star_border:before {
content: "\e83a";
}
.icon-stars:before {
content: "\e8d0";
}
.icon-thumb_down:before {
content: "\e8db";
}
.icon-thumb_up:before {
content: "\e8dc";
}
.icon-timer:before {
content: "\e425";
}
.icon-translate:before {
content: "\e8e2";
}
.icon-vertical_align_bottom:before {
content: "\e258";
}
.icon-vertical_align_top:before {
content: "\e25a";
}
.icon-watch_later:before {
content: "\e924";
}
.icon-zoom_in:before {
content: "\e8ff";
}
.icon-zoom_out:before {
content: "\e900";
}
.emoji {
display: inline-block;
text-indent: -9999px;
height: 1em;
width: 1em;
content: "";
background-size: 100% auto;
position: relative;
}
.emoji--big {
width: 3em;
height: 3em;
}
.emoji--med {
width: 2.4em;
height: 2.4em;
}
.emoji--small {
width: 1.8em;
height: 1.8em;
}
img {
max-width: 100%;
height: auto;
width: auto;
}
.illustration {
text-indent: -9999px;
background-repeat: no-repeat;
background-size: 100% auto;
background-position: center center;
margin-left: auto;
margin-right: auto;
margin-bottom: 1em;
}
.illustration--cfa-logo-black {
background-image: url("/static/intake/img/cfa-logo-black.png");
margin-left: 0;
width: 145px;
height: 64px;
background-position: center left;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--cfa-logo-black {
background-image: url("/static/intake/img/cfa-logo-black@2x.png");
background-size: 100% auto;
}
}
.illustration--cmr-logo-black {
background-image: url("/static/intake/img/cmr_logo_black_cropped.png");
margin-left: 0;
width: 145px;
height: 56px;
background-position: center left;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--cmr-logo-black {
background-image: url("/static/intake/img/cmr_logo_black_cropped@2x.png");
background-size: 100% auto;
}
}
.illustration--cfa-logo-color {
background-image: url("/static/intake/img/cfa_logo_color.png");
width: 100%;
height: 200px;
opacity: 0.5;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--cfa-logo-color {
background-image: url("/static/intake/img/cfa_logo_color@2x.png");
background-size: 100% auto;
}
}
.illustration--alameda {
background-image: url("/static/intake/img/alameda_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--alameda {
background-image: url("/static/intake/img/alameda_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--contra-costa {
background-image: url("/static/intake/img/contra_costa_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--contra-costa {
background-image: url("/static/intake/img/contra_costa_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--fresno {
background-image: url("/static/intake/img/fresno_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--fresno {
background-image: url("/static/intake/img/fresno_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--san-diego {
background-image: url("/static/intake/img/san_diego_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--san-diego {
background-image: url("/static/intake/img/san_diego_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--san-francisco {
background-image: url("/static/intake/img/san_francisco_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--san-francisco {
background-image: url("/static/intake/img/san_francisco_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--santa-barbara {
background-image: url("/static/intake/img/santa_barbara_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--santa-barbara {
background-image: url("/static/intake/img/santa_barbara_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--santa-clara {
background-image: url("/static/intake/img/santa_clara_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--santa-clara {
background-image: url("/static/intake/img/santa_clara_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--santa-cruz {
background-image: url("/static/intake/img/santa_cruz_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--santa-cruz {
background-image: url("/static/intake/img/santa_cruz_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--solano {
background-image: url("/static/intake/img/solano_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--solano {
background-image: url("/static/intake/img/solano_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--ventura {
background-image: url("/static/intake/img/ventura_seal.png");
width: 86px;
height: 86px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--ventura {
background-image: url("/static/intake/img/ventura_seal@2x.png");
background-size: 100% auto;
}
}
.illustration--bundle-icon {
background-image: url("/static/intake/img/bundle-icon.png");
width: 102px;
height: 67px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--bundle-icon {
background-image: url("/static/intake/img/bundle-icon@2x.png");
background-size: 100% auto;
}
}
.illustration--eligibility-icon {
background-image: url("/static/intake/img/eligibility-icon.png");
width: 102px;
height: 67px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--eligibility-icon {
background-image: url("/static/intake/img/eligibility-icon@2x.png");
background-size: 100% auto;
}
}
.illustration--notification-icon {
background-image: url("/static/intake/img/notification-icon.png");
width: 64px;
height: 67px;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--notification-icon {
background-image: url("/static/intake/img/notification-icon@2x.png");
background-size: 100% auto;
}
}
.illustration--partner-interface {
background-image: url("/static/intake/img/partner-interface.png");
width: 470px;
height: 295px;
background-position: top left;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--partner-interface {
background-image: url("/static/intake/img/partner-interface@2x.png");
background-size: 100% auto;
}
}
.illustration--ladders {
background-image: url("/static/intake/img/ladders.png");
width: 481px;
height: 410px;
background-position: center center;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--ladders {
background-image: url("/static/intake/img/ladders@2x.png");
background-size: 100% auto;
}
}
.illustration--ca {
background-image: url("/static/intake/img/ca.png");
width: 68px;
height: 94px;
background-position: center center;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--ca {
background-image: url("/static/intake/img/ca@2x.png");
background-size: 100% auto;
}
}
.illustration--job_search {
background-image: url("/static/intake/img/job_search.png");
width: 111px;
height: 94px;
background-position: center center;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--job_search {
background-image: url("/static/intake/img/job_search@2x.png");
background-size: 100% auto;
}
}
.illustration--10_minutes {
background-image: url("/static/intake/img/10_minutes.png");
width: 94px;
height: 94px;
background-position: center center;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--10_minutes {
background-image: url("/static/intake/img/10_minutes@2x.png");
background-size: 100% auto;
}
}
.illustration--speech_bubbles {
background-image: url("/static/intake/img/speech_bubbles.png");
width: 107px;
height: 94px;
background-position: center center;
}
@media only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 125dpi) {
.illustration--speech_bubbles {
background-image: url("/static/intake/img/speech_bubbles@2x.png");
background-size: 100% auto;
}
}
.slab {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
position: relative;
padding-top: 2em;
padding-bottom: 2em;
border-bottom: 1px solid #DEDED1;
}
@media screen and (min-width: 961px) {
.slab {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.slab--white {
background-color: #FFFFFF;
}
.slab--teal {
background-color: rgba(6, 158, 214, 0.05);
}
@media screen and (min-width: 961px) {
.slab--padded {
padding-top: 4.5em;
padding-bottom: 4.5em;
}
}
.slab--not-padded {
padding-top: 0;
padding-bottom: 0;
}
.slab--not-bottom-padded {
padding-bottom: 0;
}
.main-header + .slab--header {
padding-top: 0;
}
.slab--bleed {
overflow: hidden;
}
.card, .statistic-card, .form-card {
border: 2px solid #DEDED1;
padding: 1.5em 20px;
background-color: #FFFFFF;
margin-bottom: 2em;
}
.card > *:last-child, .statistic-card > *:last-child, .form-card > *:last-child {
margin-bottom: 0;
}
@media screen and (min-width: 961px) {
.card, .statistic-card, .form-card {
padding: 1.5em 2em;
}
}
.textwell {
padding: 2em;
max-height: 30rem;
border: 2px solid #DEDED1;
overflow: auto;
text-align: left;
margin-bottom: 1em;
}
.button, .searchbar__button {
transition: 0.1s ease-out background-color;
display: inline-block;
position: relative;
cursor: pointer;
font-weight: 500;
border: 1px solid #DEDED1;
border-bottom: 2px solid #bdbdb2;
background-color: #FFFFFF;
padding: 0.5em 1em;
border-radius: 2px;
margin-bottom: 0.5em;
margin-right: 0.3em;
text-decoration: none;
color: #000000;
}
.button:hover, .searchbar__button:hover {
background-color: #e5e5da;
color: #000000;
}
.button:active, .searchbar__button:active {
background-color: #bdbdb2;
}
.button:focus, .searchbar__button:focus {
outline: 2px solid #83cfeb;
}
.button--cta {
color: #FFFFFF;
background-color: #A6005E;
border-color: #A6005E;
border-bottom-color: #8d0050;
}
.button--cta:hover {
background-color: #b8337e;
color: #FFFFFF;
}
.button--cta:active {
background-color: #8d0050;
}
.button--primary, .pagination .pagination__selected {
color: #FFFFFF;
background-color: #069ed6;
border-color: #069ed6;
border-bottom-color: #0586b6;
}
.button--primary:hover, .pagination .pagination__selected:hover {
background-color: #38b1de;
color: #FFFFFF;
}
.button--primary:active, .pagination .pagination__selected:active {
background-color: #0586b6;
}
.button--danger {
color: #D40000;
}
.button--danger:hover {
color: #D40000;
}
.button--small {
font-size: 16px;
padding: 0.2em 0.7em;
border-bottom-width: 1px;
}
.button--inline {
font-size: 0.8em;
padding: 0.2em;
border-bottom-width: 1px;
}
.button--large {
font-size: 24px;
}
.button__icon {
margin-left: 0.5em;
}
.button__icon--left {
margin-right: 0.5em;
}
fieldset {
border: 0;
padding: 0;
margin: 0;
}
label {
line-height: 1.5em;
}
.form-question {
display: block;
margin-bottom: 1em;
font-weight: 500;
}
@media screen and (min-width: 961px) {
.form-question {
font-weight: 400;
}
}
.text-input {
display: block;
width: 100%;
font-size: 24px;
font-weight: 500;
margin-top: -0.5em;
margin-bottom: 1em;
padding: 0.5em 0;
border: 0;
border-bottom: 2px solid #666666;
border-radius: 0;
background-color: transparent;
outline: none;
}
.text-input:focus {
border-color: #069ed6;
}
.text-input ::placeholder {
color: #AAAAAA;
}
.radio-button {
transition: 0.1s ease-out all;
user-select: none;
position: relative;
display: block;
cursor: pointer;
font-size: 24px;
font-weight: 500;
margin-bottom: 0.5em;
padding: 0.3em 0.7em;
padding-left: 2em;
background-color: #FFFFFF;
border: 2px solid #EAEAE9;
border-radius: 2px;
}
.radio-button input[type=radio] {
position: absolute;
top: 0.75em;
left: 0.7em;
}
.radio-button:hover {
background-color: #EAEAE9;
}
.radio-button.is-selected {
background-color: #069ed6;
border-color: #069ed6;
color: #fff;
}
.checkbox {
transition: 0.1s ease-out all;
user-select: none;
position: relative;
cursor: pointer;
display: block;
font-size: 24px;
font-weight: 500;
background-color: #FFFFFF;
margin-bottom: 0.5em;
padding: 0.3em 0.7em;
padding-left: 2em;
border: 2px solid #EAEAE9;
border-radius: 2px;
}
.checkbox input[type=checkbox] {
position: absolute;
top: 0.75em;
left: 0.7em;
margin-right: 0.5em;
}
.checkbox:hover {
background-color: #EAEAE9;
}
.checkbox.is-selected {
background-color: #069ed6;
border-color: #069ed6;
color: #fff;
}
.textarea {
border: 2px solid #666666;
border-radius: 2px;
width: 100%;
outline: 0;
padding: 1em;
line-height: 1.5em;
margin-bottom: 0.5em;
}
.textarea:focus {
border-color: #069ed6;
}
.select {
position: relative;
display: inline-block;
margin-bottom: 0.5em;
font-size: 24px;
background-color: #FFFFFF;
}
.select:before {
transition: 0.1s ease-out all;
position: absolute;
right: 0em;
top: 0em;
bottom: 0;
padding-top: 0.5em;
display: block;
font-family: "icomoon";
content: "\e313";
background-color: #EAEAE9;
color: #069ed6;
border: 2px solid #EAEAE9;
width: 2em;
text-align: center;
z-index: 0;
}
.select:hover:before {
background-color: #f0f0f0;
border-color: #f0f0f0;
}
.select:active:before {
background-color: #d3d3d2;
border-color: #d3d3d2;
}
.select__element {
appearance: none;
position: relative;
z-index: 1;
border: 2px solid #EAEAE9;
border-radius: 2px;
padding: 0.5em 2.7em 0.5em 0.7em;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
font-size: 24px;
font-weight: 500;
outline: 0;
background-color: transparent;
}
.select__element:focus {
border-color: #069ed6;
}
.file-upload__input {
width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}
.file-upload__input:focus + .file-upload__label {
outline: 2px solid #83cfeb;
}
.form-width--short {
max-width: 6em;
}
.form-width--med {
max-width: 12em;
}
.form-width--long {
max-width: 20em;
}
.form-width--casenumber {
max-width: 8em;
}
.form-width--name {
max-width: 12em;
}
.form-width--phone {
max-width: 8em;
}
.form-width--ssn {
max-width: 7em;
}
.form-width--zip {
max-width: 5em;
}
.form-width--searchbar {
max-width: 30em;
}
/* Molecules */
.media-box {
margin-bottom: 1em;
}
.media-box::after {
clear: both;
content: "";
display: block;
}
.media-box__media {
float: left;
margin-right: 2em;
}
.media-box__content {
overflow: hidden;
zoom: 1;
}
.media-box--reversed .media-box__media {
float: right;
margin-left: 1em;
margin-right: 0;
}
.media--icon {
width: 1.5em;
max-height: 1.5em;
margin-right: 1em;
}
.media-box--reversed .media--icon {
margin-left: 1em;
}
.media--small {
width: 4.8em;
margin-right: 1em;
}
.media-box--reversed .media--small {
margin-left: 1em;
}
@media screen and (min-width: 481px) {
.media--small {
width: 6em;
max-height: 6em;
margin-right: 2em;
}
.media-box--reversed .media--small {
margin-left: 2em;
}
}
.media--med {
width: 8em;
max-height: 8em;
margin-right: 2em;
}
.media-box--reversed .media--med {
margin-left: 2em;
}
.media--large {
width: 10em;
max-height: 10em;
margin-right: 3em;
}
.media-box--reversed .media--large {
margin-left: 3em;
}
.media-box--bleed {
margin-bottom: 6em;
}
.media-box--bleed:last-of-type {
margin-bottom: 0;
}
.media-box--bleed .media-box__media {
float: none;
width: 100%;
margin-bottom: 2em;
}
@media screen and (min-width: 961px) {
.media-box--bleed .media-box__media {
width: 50%;
float: right;
margin-bottom: 0;
margin-left: 120px;
margin-right: -120px;
}
}
.media-box--bleed.media-box--reversed .media-box__media {
float: none;
width: 100%;
margin-left: 0;
}
@media screen and (min-width: 961px) {
.media-box--bleed.media-box--reversed .media-box__media {
width: 50%;
float: left;
margin-right: 120px;
margin-left: -120px;
}
}
.flash {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
position: relative;
padding-top: 1em;
padding-bottom: 1em;
background-color: #fff;
font-weight: 500;
}
@media screen and (min-width: 961px) {
.flash {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.flash:last-child {
box-shadow: 10px 0 10px rgba(0, 0, 0, 0.25);
}
.flash p:last-child {
margin-bottom: 0;
}
.flash a {
color: inherit;
}
.flash.error {
background-color: #f6cccc;
}
.flash.success {
color: #fff;
background-color: #3ea06b;
}
.toolbar {
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
.toolbar::after {
clear: both;
content: "";
display: block;
}
.toolbar__item {
float: left;
margin-right: 1em;
}
.toolbar__left {
float: left;
margin-right: 0.5em;
}
.toolbar__right {
float: right;
margin-left: 0.5em;
}
.toolbar__right .toolbar__item {
margin-right: 0;
margin-left: 1em;
display: inline-block;
float: left;
}
.tab-bar {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
border-bottom: 2px solid #DEDED1;
margin-top: 1em;
font-size: 16px;
}
.tab-bar::after {
clear: both;
content: "";
display: block;
}
@media screen and (min-width: 961px) {
.tab-bar {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.tab-bar__tab {
position: relative;
display: block;
float: left;
margin-right: 0.5em;
margin-bottom: -2px;
border: 2px solid #DEDED1;
background-color: rgba(222, 222, 209, 0.25);
padding: 0.5em 1.5em;
color: #666666;
text-decoration: none;
min-width: 8em;
text-align: center;
}
.tab-bar__tab:hover {
background-color: rgba(6, 158, 214, 0.1);
color: #666666;
}
.tab-bar__tab.is-selected {
z-index: 2;
color: #000;
font-weight: 600;
background-color: #FAFAF9;
}
.tab-bar__tab.is-selected:before {
content: "";
position: absolute;
display: block;
left: 0;
right: 0;
bottom: -2px;
height: 2px;
background-color: #FAFAF9;
}
.searchbar {
display: table;
width: 100%;
border-collapse: separate;
}
.searchbar__input {
display: table-cell;
width: 100%;
border: 2px solid #EAEAE9;
padding: 0.5em 0.7em 0.5em 0.7em;
margin: 0;
outline: 0;
}
.searchbar__input:focus {
border-color: #069ed6;
}
.searchbar__button {
transition: all 0.1s ease-out;
user-select: none;
display: table-cell;
vertical-align: middle;
appearance: none;
width: 1%;
border: 2px solid #EAEAE9;
background-color: #EAEAE9;
color: #069ed6;
text-align: center;
margin: 0;
}
.searchbar__button button {
display: none;
}
.searchbar__button:hover {
color: #069ed6;
background-color: #f0f0f0;
border-color: #f0f0f0;
}
.searchbar__button:active {
color: #069ed6;
background-color: #d3d3d2;
border-color: #d3d3d2;
}
.input-group--block .radio-button, .input-group--block .checkbox {
display: block;
width: 100%;
max-width: 20em;
}
.input-group--inline {
margin-bottom: 0.5em;
}
.input-group--inline .radio-button, .input-group--inline .checkbox {
display: inline-block;
margin-right: 0.3em;
}
.input-group--inline .select {
display: inline-block;
margin-right: 0.5em;
}
.input-group--two-up {
margin-bottom: 0.5em;
}
.input-group--two-up::after {
clear: both;
content: "";
display: block;
}
.input-group--two-up .radio-button, .input-group--two-up .checkbox {
display: block;
float: left;
width: 100%;
max-width: 12em;
margin-right: 0.5em;
}
.input-group--image .radio-button {
padding: 0.5em;
}
.input-group--image input {
display: none;
}
.text-input-group {
display: table;
margin-bottom: 1em;
font-size: 24px;
line-height: 1em;
border-collapse: separate;
width: 100%;
}
.text-input-group .text-input-group__prefix {
display: table-cell;
width: 1%;
font-weight: 500;
border-bottom: 2px solid #666666;
padding: 0 0.3em 0.5em 0;
vertical-align: middle;
}
.text-input-group .text-input {
display: table-cell;
margin-bottom: 0;
vertical-align: middle;
}
.text-input-group .text-input-group__postfix {
display: table-cell;
width: 1%;
font-weight: 500;
border-bottom: 2px solid #666666;
padding: 0 0 0.5em 0.3em;
vertical-align: middle;
}
.form-group {
margin-bottom: 4em;
position: relative;
}
.form-group .form-question + .text--help, .form-group .form-question + .statistic-card__label, .form-group .data-table .form-question + th, .data-table .form-group .form-question + th, .form-group .form-question + .summary-table__label {
margin-top: -1em;
margin-bottom: 1em;
}
.form-group--error {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
}
@media screen and (min-width: 961px) {
.form-group--error {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.form-group--error:before {
content: "";
display: block;
position: absolute;
top: -0.5em;
bottom: -0.5em;
left: 0px;
width: 4px;
background-color: #f4bfbf;
}
@media screen and (min-width: 961px) {
.form-group--error:before {
width: 6px;
}
}
.question-with-follow-up {
margin-bottom: 4em;
}
.question-with-follow-up__question .form-group {
margin-bottom: 1em;
}
.question-with-follow-up__follow-up {
display: none;
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
position: relative;
background-color: #FAFAF9;
border-top: 2px solid #DEDED1;
border-bottom: 2px solid #DEDED1;
padding-top: 2em;
padding-bottom: 2em;
padding-left: 40px;
}
@media screen and (min-width: 961px) {
.question-with-follow-up__follow-up {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
@media screen and (min-width: 961px) {
.question-with-follow-up__follow-up {
border-left: 2px solid #DEDED1;
border-right: 2px solid #DEDED1;
padding-left: 80px;
}
}
.question-with-follow-up__follow-up .form-group:last-of-type {
margin-bottom: 0;
}
.question-with-follow-up__follow-up:before {
width: 0;
height: 0;
content: "";
z-index: 10;
border-bottom: 18px solid #DEDED1;
border-left: 12px solid transparent;
border-right: 12px solid transparent;
content: "";
display: block;
position: absolute;
top: -19px;
left: 40px;
}
@media screen and (min-width: 961px) {
.question-with-follow-up__follow-up:before {
left: 60px;
}
}
.question-with-follow-up__follow-up:after {
width: 0;
height: 0;
content: "";
z-index: 10;
border-bottom: 15px solid #FAFAF9;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
content: "";
display: block;
position: absolute;
top: -15px;
left: 42px;
}
@media screen and (min-width: 961px) {
.question-with-follow-up__follow-up:after {
left: 62px;
}
}
.incrementer {
display: table;
border-collapse: separate;
border-spacing: 1em;
margin-bottom: 0.5em;
}
.incrementer .text-input {
appearance: none;
display: table-cell;
text-align: center;
margin-bottom: 0;
padding-left: 1em;
padding-right: 1em;
}
.incrementer .text-input::-webkit-inner-spin-button {
display: none;
}
.incrementer__subtract, .incrementer__add {
transition: 0.1s ease-out background-color;
user-select: none;
cursor: pointer;
color: #069ed6;
display: table-cell;
width: 1%;
background-color: #EAEAE9;
font-size: 24px;
font-weight: 500;
padding: 0.5em 0;
width: 2.3em;
text-align: center;
border-radius: 2px;
text-decoration: none;
}
.incrementer__subtract:hover, .incrementer__add:hover {
background-color: #f0f0f0;
}
.incrementer__subtract:active, .incrementer__add:active {
background-color: #d3d3d2;
}
@keyframes scroller {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.scroller {
animation: scroller 2s 1;
position: absolute;
left: 50%;
bottom: 1em;
margin-left: -1em;
display: block;
width: 2em;
height: 2em;
color: #30302F;
text-decoration: none;
}
.scroller:before {
font-family: "icomoon";
font-size: 28px;
display: block;
content: "\e313";
text-align: center;
line-height: 1.5em;
}
.scroller--light {
color: #FFFFFF;
}
.scroller--light:hover {
color: #A6005E;
}
.progress-indicator {
width: 10em;
margin: 2em auto;
text-align: center;
position: relative;
}
.progress-indicator:before {
content: "";
display: block;
position: absolute;
top: 0;
height: 6px;
left: 0;
right: 0;
border-radius: 3px;
background-color: #EAEAE9;
z-index: -1;
border: 1px solid #DEDED1;
}
.progress-indicator__bar {
height: 6px;
min-width: 6px;
border-radius: 3px;
background-color: #069ed6;
}
.progress-indicator__percentage {
margin-top: 0.5em;
font-size: 16px;
}
.summary-table {
text-align: center;
}
.summary-table .grid__item {
margin-bottom: 1em;
}
.summary-table--left {
text-align: left;
}
.summary-table__label {
margin-bottom: 0;
}
.data-table-container {
margin-left: -20px;
margin-right: -20px;
}
@media screen and (min-width: 961px) {
.data-table-container {
margin-left: -40px;
margin-right: -40px;
}
}
.data-table {
width: 100%;
text-align: left;
font-size: 16px;
border-collapse: collapse;
border-bottom: 2px solid #DEDED1;
margin-bottom: 1em;
}
.data-table th, .data-table td {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
.data-table th:first-child, .data-table td:first-child {
padding-left: 20px;
}
.data-table th:last-child, .data-table td:last-child {
padding-right: 20px;
}
.data-table th a, .data-table td a {
color: inherit;
text-decoration: none;
}
.data-table th .is-selected, .data-table td .is-selected {
color: #069ed6;
font-weight: 700;
}
@media screen and (min-width: 961px) {
.data-table th:first-child, .data-table td:first-child {
padding-left: 40px;
}
.data-table th:last-child, .data-table td:last-child {
padding-right: 40px;
}
}
.data-table th {
font-weight: 400;
border-bottom: 2px solid #DEDED1;
}
.data-table tr:nth-child(2n) td {
background-color: #FAFAF9;
}
.data-table tr:nth-child(2n-1) td {
background-color: #FFFFFF;
}
.data-table tr.row--error td {
background-color: #e56666;
}
.data-table tr.row--warning td {
background-color: #ffdd78;
}
.data-table td {
border-bottom: 1px solid #DEDED1;
}
.data-table td:first-child {
font-weight: 700;
}
.data-table .status {
white-space: nowrap;
}
.data-table .status.successful {
color: #43AE74;
}
.data-table .status.failure {
color: #D40000;
}
.data-table .status.not-applicable {
opacity: 0.3;
}
.data-table--selectable tr:hover td {
background-color: rgba(6, 158, 214, 0.1);
cursor: pointer;
}
.data-table--divided td {
border-right: 1px solid #DEDED1;
}
.data-table--divided td:first-child {
border-right: none;
}
.steps {
position: relative;
}
@media screen and (min-width: 961px) {
.steps:before {
content: "";
display: block;
position: absolute;
top: 25px;
height: 3px;
width: 80%;
margin-left: 10%;
background-color: #EAEAE9;
z-index: 0;
}
}
.steps .illustration {
position: relative;
background-color: #fff;
}
.steps .illustration:before {
content: "";
z-index: 0;
display: block;
position: absolute;
border: 20px solid #fff;
top: -20px;
right: -20px;
bottom: -20px;
left: -20px;
}
.steps .grid__item {
margin-bottom: 2em;
}
@media screen and (min-width: 961px) {
.steps .grid__item {
margin-bottom: 0;
}
}
/* Organisms */
.main-header {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
padding-top: 1em;
padding-bottom: 1em;
background-color: #ffffff;
}
@media screen and (min-width: 961px) {
.main-header {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.main-header .toolbar__right {
float: left;
margin-left: 0;
}
.main-header .toolbar__right .toolbar__item {
margin-left: 0;
margin-right: 1em;
}
@media screen and (min-width: 481px) {
.main-header .toolbar__right {
float: right;
margin-left: 1em;
}
.main-header .toolbar__right .toolbar__item {
margin-left: 1em;
margin-right: 0;
}
}
.main-header__title {
font-size: 16px;
line-height: 1.5em;
margin-bottom: 0;
font-weight: 500;
color: #000;
}
.main-header__title a {
color: #000;
text-decoration: none;
}
.main-header__title .main-header__logo {
position: relative;
text-decoration: none;
display: inline-block;
color: #000;
}
body {
margin-bottom: 450px;
}
@media screen and (min-width: 961px) {
body {
margin-bottom: 300px;
}
}
.main-footer {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 450px;
padding: 2em 20px;
}
@media screen and (min-width: 961px) {
.main-footer {
padding: 2em 40px;
height: 300px;
}
}
.main-footer__legal {
font-size: 16px;
}
.main-footer__legal p {
margin-bottom: 0em;
}
.main-footer__legal p::after {
clear: both;
content: "";
display: block;
}
.main-footer__cfa-logo {
margin-top: 2em;
}
@media screen and (min-width: 961px) {
.main-footer__cfa-logo {
margin-top: 1em;
float: right;
}
}
.main-footer .select:before {
color: #666666;
}
.main-footer .select__element {
border-radius: 0;
}
.main-footer .select__element:focus {
border-color: #666666;
}
.form-card {
margin-left: -20px;
margin-right: -20px;
border: 0;
border-bottom: 1px solid #DEDED1;
}
@media screen and (min-width: 961px) {
.form-card {
border: 2px solid #DEDED1;
margin-left: 0;
margin-right: 0;
}
}
.form-card--compact .form-card__header {
margin-top: 0.5em;
padding-bottom: 2em;
}
.form-card--compact .form-group {
margin-bottom: 3em;
}
.form-card__header {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
border-bottom: 2px solid #DEDED1;
margin-top: 1em;
margin-bottom: 2em;
padding-bottom: 2.5em;
}
@media screen and (min-width: 961px) {
.form-card__header {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.form-card__title {
font-size: 24px;
line-height: 1.5em;
margin-top: 0;
margin-bottom: 0;
}
.form-card__title + .text--help, .form-card__title + .statistic-card__label, .form-card__title + .summary-table__label, .data-table .form-card__title + th, .form-card__title + .text--small {
margin-top: 0.5em;
margin-bottom: 0;
}
.form-card__content > *:last-child {
margin-bottom: 0;
}
.form-card__footer {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
border-top: 2px solid #DEDED1;
margin-top: 2em;
padding-top: 1.5em;
}
@media screen and (min-width: 961px) {
.form-card__footer {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.form-card__footer *:last-child {
margin-bottom: 0;
}
.form-card--transition {
border-top: 8px solid #DEDED1;
text-align: center;
padding-top: 3em;
padding-bottom: 3em;
}
.form-card--transition .form-card__header {
margin-bottom: 3.5em;
margin-top: 0;
border-bottom: 0;
padding-bottom: 0;
}
.form-card--transition .form-card__footer {
border-top: 0;
padding-top: 0;
margin-top: 3em;
}
.form-card--transition .form-card__title {
font-size: 28px;
}
.form-card--transition .form-card__content .list--bulleted {
max-width: 30em;
text-align: left;
margin: 0 auto;
}
.form-card--transition .form-card__header .form-card__title, .form-card--transition .form-card__header > p, .form-card--transition .form-card__content .form-card__title, .form-card--transition .form-card__content > p, .form-card--transition .form-card__footer .form-card__title, .form-card--transition .form-card__footer > p {
max-width: 55rem;
margin-left: auto;
margin-right: auto;
}
.statistic-card__label {
margin-bottom: 0.5em;
}
.statistic-card__number {
margin-top: 0;
}
.pagination {
padding: 2em 0;
}
.pagination::after {
clear: both;
content: "";
display: block;
}
.pagination .text--help, .pagination .summary-table__label, .pagination .data-table th, .data-table .pagination th, .pagination .statistic-card__label {
margin-top: 0.3em;
}
.pagination .button, .pagination .searchbar__button {
min-width: 2.5em;
text-align: center;
}
.pagination .pagination__ellipsis {
display: inline-block;
width: 2em;
text-align: center;
}
@media screen and (min-width: 961px) {
.pagination .pagination__info {
float: left;
}
.pagination .pagination__buttons {
float: right;
}
}
.demo-banner {
margin-left: -20px;
margin-right: -20px;
padding-left: 20px;
padding-right: 20px;
position: relative;
z-index: 2;
background-color: #D40000;
padding: 0.5em;
text-align: center;
font-size: 16px;
color: #FFFFFF;
}
@media screen and (min-width: 961px) {
.demo-banner {
margin-left: -40px;
margin-right: -40px;
padding-left: 40px;
padding-right: 40px;
}
}
.county-seal-list {
text-align: center;
max-width: 35em;
margin: 0 auto;
}
.county-seal-list + p {
text-align: center;
}
.county-seal {
margin: 0 0.4em 0.4em 0.4em;
display: inline-block;
text-align: center;
outline: 10px red !important;
}
.sunset-notice-alert {
background-color: #E5F2FD;
padding: 15px 10px;
}
.sunset-notice-alert__icon {
position: absolute;
color: #1380D0;
font-size: 32px;
display: none;
}
@media screen and (min-width: 961px) {
.sunset-notice-alert__icon {
display: block;
}
}
.sunset-notice-alert__details {
margin-bottom: 0;
margin-left: 0;
}
@media screen and (min-width: 961px) {
.sunset-notice-alert__details {
margin-left: 45px;
}
}
/* Templates */
.banner {
background-color: #E5F2FD;
color: #423A3E;
text-align: center;
padding: 10px;
margin-top: 2em;
margin-left: inherit;
margin-right: inherit;
margin-bottom: 0;
}
.partnerships-contact .slab {
border-top: 1px solid #DEDED1;
}
/* Shame */
.lt-ie10 .select:before {
display: none;
}
.lt-ie10 .select__element {
padding-right: 0.7em;
}
/* this is a file for shameful hacks, so they can act as temporary solutions
If you put something here, fix it and take it out later :)
*/
/*# sourceMappingURL=cfa.css.map */