:root { /* alerts / notifications */ /* shades */ /* structure */ /* ACCESSIBILITY - below color meets the standard of 3:1 to a white background */ /* forms */ } :root { /* reference: https://medallia-alchemy.com/latest/react/theme-helpers/typeStyle/ */ } body { font: 400 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } p { line-height: 1.5; } /* type styles classes */ .type-style-displayL { font: 400 68px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-displayM { font: 700 44px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-displayS { font: 400 28px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-headerXL { font: 400 32px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-headerL { font: 600 24px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-headerM { font: 700 20px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-headerS { font: 700 18px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-subHeaderL { font: 400 20px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-subHeaderM { font: 700 16px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-subHeaderS { font: 700 14px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-dataL { font: 700 36px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-dataM { font: 700 28px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-dataS { font: 700 16px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-bodyL { font: 400 16px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-bodyM { font: 700 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-bodyS { font: 400 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-actionM { font: 700 14px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-labelL { font: 700 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-labelM { font: 400 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-captionM { font: 400 12px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .type-style-captionS { font: 600 10px "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } .mdl-icon { display: inline-block; width: 24px; height: 24px; vertical-align: middle; transition: transform .3s ease-in-out; } .mdl-icon.-dark svg { color: #2C3548; } .mdl-icon.-outline svg { color: transparent !important; stroke: #949494; } .mdl-icon.-xs { width: 12px; height: 12px; } .mdl-icon.-s { width: 16px; height: 16px; } .mdl-icon.-sm { width: 20px; height: 20px; } .mdl-icon.-l { width: 32px; height: 32px; } .mdl-icon.-rot-45 { transform: rotate(45deg); transform-origin: center center; } .mdl-icon.-rot-90 { transform: rotate(90deg); transform-origin: center center; } .mdl-icon.-rot-135 { transform: rotate(135deg); transform-origin: center center; } .mdl-icon.-rot-180 { transform: rotate(180deg); transform-origin: center center; } .mdl-icon.-rot-225 { transform: rotate(225deg); transform-origin: center center; } .mdl-icon.-rot-270 { transform: rotate(270deg); transform-origin: center center; } .mdl-icon.-success svg { color: #ADEAC3; } .mdl-icon.-error svg { color: #F3AFB7; } .mdl-icon svg { display: block; max-width: 100%; max-height: 100%; color: inherit; } /* Tidy up display of existing icons with mdl-icon class */ .mdl-icon[class*="icon-"] { line-height: inherit; } .mdl-svg.-fill.-white path { fill: #FFF !important; } /* layer($layer) Get an appropriate z-index for a given layer. 0-6 returns 0-600 Markup: z-index: layer(6); Style guide: SASS.Layers */ /* #region Fonts & Typography */ /* #endregion */ /* #region Geometric Progression */ /* #endregion */ /* #region Colours */ /* Darken & lighten amounts */ /* #endregion */ /* #region Neutrals */ .mdl-dashboard-color-neutral-01 { color: white; } .mdl-dashboard-color-neutral-bg-01 { background: white; } .mdl-dashboard-color-neutral-05 { color: #f2f2f2; } .mdl-dashboard-color-neutral-bg-05 { background: #f2f2f2; } .mdl-dashboard-color-neutral-10 { color: #e6e6e6; } .mdl-dashboard-color-neutral-bg-10 { background: #e6e6e6; } .mdl-dashboard-color-neutral-20 { color: #cccccc; } .mdl-dashboard-color-neutral-bg-20 { background: #cccccc; } .mdl-dashboard-color-neutral-30 { color: #b3b3b3; } .mdl-dashboard-color-neutral-bg-30 { background: #b3b3b3; } .mdl-dashboard-color-neutral-70 { color: #4d4d4d; } .mdl-dashboard-color-neutral-bg-70 { background: #4d4d4d; } .mdl-dashboard-color-neutral-80 { color: #333333; } .mdl-dashboard-color-neutral-bg-80 { background: #333333; } .mdl-dashboard-color-neutral-90 { color: #1a1a1a; } .mdl-dashboard-color-neutral-bg-90 { background: #1a1a1a; } .mdl-dashboard-color-neutral-95 { color: #0d0d0d; } .mdl-dashboard-color-neutral-bg-95 { background: #0d0d0d; } .mdl-dashboard-color-neutral-white { background: hsl(0deg, 0%, 100%); } .mdl-dashboard-color-neutral-black { background: #1a1a1a; } /* #endregion */ /* #region Breakpoints */ /* Breakpoints all + 1px */ /* #endregion */ /* #region Transitions & Animation */ /* Transition durations */ /* #endregion */ /* breakpoint-set($breakpoint) Default breakpoints. Can be overridden in your own scss. Outputs @media(min-width: [size]px) { @content } Alias: bp-s($breakpoint) Markup: .className { ... @include breakpoint-set({{modifier_class}}) { ... } } 's' - Small 'm' - Medium 'l' - Large 'xl' - Extra Large Style guide: SASS.Breakpoints.Set */ /* breakpoint-get($breakpoint) Get breakpoint size. Same values as breakpoint-set(). Alias: bp-g($breakpoint) Markup: .className { max-width: breakpoint-get('l') { ... } } Style guide: SASS.Breakpoints.Get */ /* Use rem-font-size for inserting font-size: in your rules. Use the rem-calc for when yiou only require the number. */ .mdl-dashboard * { box-sizing: border-box; } .mdl-dashboard small { font-size: 10px; } .mdl-dashboard-hidden { display: none; } @media screen and (min-width: 0px) and (max-width: 576px) { body.mdl-dashboard-no-scroll { overflow: hidden; } } .mdl-app-dashboard { background: #fff; } .mdl-dashboard { height: 100%; } .mdl-dashboard-container { width: 100%; height: 100%; margin: 0 auto; transition: width 0.3s ease-in-out; } .mdl-dashboard-outer { margin: 0.625rem 0; padding: 0; } .mdl-dashboard-outer--flush .mdl-dashboard-inner { max-width: 1024px; } .mdl-dashboard-outer--dim { background-color: #f2f2f2; } .mdl-dashboard-outer--sticky { position: sticky; top: 0; z-index: 500; } .mdl-dashboard-inner { position: relative; max-width: 980px; height: 100%; margin: 0 auto; } .mdl-dashboard__only--xs { display: none; } @media screen and (min-width: 0px) { .mdl-dashboard__only--xs { display: block; } } .mdl-dashboard__not--xs { display: block; } @media screen and (min-width: 0px) { .mdl-dashboard__not--xs { display: none; } } .mdl-dashboard__only--s { display: none; } @media screen and (min-width: 577px) { .mdl-dashboard__only--s { display: block; } } .mdl-dashboard__not--s { display: block; } @media screen and (min-width: 577px) { .mdl-dashboard__not--s { display: none; } } .mdl-dashboard__only--m { display: none; } @media screen and (min-width: 769px) { .mdl-dashboard__only--m { display: block; } } .mdl-dashboard__not--m { display: block; } @media screen and (min-width: 769px) { .mdl-dashboard__not--m { display: none; } } .mdl-dashboard__only--l { display: none; } @media screen and (min-width: 993px) { .mdl-dashboard__only--l { display: block; } } .mdl-dashboard__not--l { display: block; } @media screen and (min-width: 993px) { .mdl-dashboard__not--l { display: none; } } .mdl-dashboard__only--xl { display: none; } @media screen and (min-width: 1201px) { .mdl-dashboard__only--xl { display: block; } } .mdl-dashboard__not--xl { display: block; } @media screen and (min-width: 1201px) { .mdl-dashboard__not--xl { display: none; } } .mdl-dashboard__only--xxl { display: none; } @media screen and (min-width: 1441px) { .mdl-dashboard__only--xxl { display: block; } } .mdl-dashboard__not--xxl { display: block; } @media screen and (min-width: 1441px) { .mdl-dashboard__not--xxl { display: none; } } .mdl-dashboard--left { text-align: left; } .mdl-dashboard--right { text-align: right; } .mdl-dashboard--center { margin: 0.625rem 0; text-align: center; } .mdl-dashboard-transition__slide { transition-property: height, margin !important; transition-duration: 0.3s; } .numInputWrapper .arrowUp, .numInputWrapper .arrowDown { background: none; left: auto; } .mdl-dashboard .fa { width: 2rem; height: 2rem; } .mdl-dashboard-container .smooth-dnd-container.vertical .smooth-dnd-draggable-wrapper { overflow: visible; } /* Override PHP app styling */ .-dashboard .l-grid__container { padding: 0; } .-dashboard .main_content { width: 100%; } .mdl-dashboard-alert { border-radius: 0px; border-width: 1px; border-style: solid; color: #595959; padding: 1rem; margin: 1rem 0; } .mdl-dashboard-alert--info { border-color: #91d5ff; background-color: #e6f7ff; } .mdl-dashboard-alert--success { border-color: #b7eb8f; background-color: #f6ffed; } .mdl-dashboard-alert--warning { border-color: #ffe58f; background-color: #fffbe6; } .mdl-dashboard-alert--error { border-color: #ffa39e; background-color: #fff1f0; } .mdl-dashboard-actions { display: flex; flex-wrap: wrap; align-items: center; padding: 16px; margin-bottom: 16px; background: #FFFFFF; } .mdl-dashboard-actions-container { height: 0; top: 0; transition: all 0.3s ease; position: sticky; z-index: 500; overflow: hidden; } .mdl-dashboard-actions-container--with-header { top: 110px; } .mdl-dashboard-actions > * + * { margin-left: 0.625rem; } .mdl-dashboard-actions--left { margin-right: auto; } .mdl-dashboard-actions--right { margin-left: auto; } .mdl-dashboard-actions p { margin-bottom: 0; } .mdl-dashboard-actions--hidden { visibility: hidden; } .mdl-dashboard-actions-half-container { display: flex; width: 50%; align-items: center; border: none; margin: 0; } .mdl-dashboard-actions--idea-label-button-container { flex-basis: auto; flex-grow: 0; } .mdl-dashboard-actions--idea-label-and-title-button-container { display: flex; flex-basis: auto; flex-grow: 1; overflow: hidden; } .mdl-dashboard-actions--idea-button { flex-grow: 1; text-align: left; margin-left: 0.625em; margin-right: 0.625em; } .mdl-dashboard-actions--idea-label-and-title-text { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* cwd-button An <a> link or <button> button. All <button> have class .cwd-button but necessarily all <a> Markup: Button .cwd-button--primary - Primary .cwd-button--secondary - Secondary .cwd-button--ghost - Ghost .cwd-button--primary.cwd-button--mini - Mini .cwd-button--primary.cwd-button--maxi - Maxi Style guide: Atoms.Buttons */ .mdl-dashboard-button { display: inline-block; position: relative; max-width: 100%; margin: 0; padding: calc(0.625rem - 2px) 0.625rem; background: transparent; border: 1px solid transparent; font-weight: 500; text-align: center; text-decoration: none; cursor: pointer; transition: all 0.3s ease-in-out; /* #region states */ /* #endregion */ /* #region --primary */ /* #endregion */ /* #region --ghost */ /* #endregion */ /* #region --secondary */ /* #endregion */ /* #region --neutral */ /* #endregion */ /* #region --icon-only */ /* #endregion */ /* #region --mini */ /* #endregion */ /* #region --maxi */ /* #endregion */ /* #region modifiers */ /* #endregion */ } .mdl-dashboard-button + .mdl-dashboard-button { margin-left: 0.625rem; } .mdl-dashboard-button .fa { line-height: 1rem; font-size: 1.225rem; height: 1rem; width: 1.5rem; margin-left: 0.225rem; text-align: center; } html[dir=rtl] .mdl-dashboard-button .fa { margin-right: 0.225rem; margin-left: 0; text-align: left; } .mdl-dashboard-button:hover:not([disabled]) { text-decoration: none; color: inherit; } .mdl-dashboard-button:disabled { cursor: default; } .mdl-dashboard-button--half-width { min-width: 50%; max-width: 50%; } .mdl-dashboard-button--full-width { min-width: 100%; max-width: 100%; } .mdl-dashboard-button--primary, .mdl-dashboard-button--secondary { background: var(--color-button); color: var(--color-button-text); border-color: var(--color-button); } .mdl-dashboard-button--primary:hover:not([disabled]), .mdl-dashboard-button--secondary:hover:not([disabled]), .mdl-dashboard-button--primary:active, .mdl-dashboard-button--secondary:active { background: var(--color-button); color: var(--color-button-text); border-color: var(--color-button); } .mdl-dashboard-button--primary-inverted { background: var(--color-button-text); color: var(--color-button); border-color: var(--color-button-text); border-width: 1px; } .mdl-dashboard-button--primary-inverted:hover:not([disabled]), .mdl-dashboard-button--primary-inverted:active { background: var(--color-button-text); color: var(--color-button); border-color: var(--color-button-text); } .mdl-dashboard-button--primary:disabled, .mdl-dashboard-button--secondary:disabled { background: #e6e6e6; border-color: #e6e6e6; color: #b3b3b3; } .mdl-dashboard-button--ghost, .mdl-dashboard-button--secondary-ghost { background: transparent; border: 1px solid var(--color-button); color: var(--color-button-text); } .mdl-dashboard-button--ghost:hover:not([disabled]), .mdl-dashboard-button--secondary-ghost:hover:not([disabled]), .mdl-dashboard-button--ghost:active, .mdl-dashboard-button--secondary-ghost:active { background: transparent; border: 1px solid var(--color-button); } .mdl-dashboard-button--ghost-inverted { border: 1px solid var(--color-button-text); color: var(--color-button-text); } .mdl-dashboard-button--ghost-inverted:hover, .mdl-dashboard-button--ghost-inverted:active { border: 1px solid var(--color-button-text); color: var(--color-button-text); } .mdl-dashboard-button--secondary { background: hsl(176deg, 42%, 54%); border-color: hsl(176deg, 42%, 54%); } .mdl-dashboard-button--secondary:hover, .mdl-dashboard-button--secondary:active { background: hsl(176deg, 42%, 54%); border-color: hsl(176deg, 42%, 54%); } .mdl-dashboard-button--secondary-ghost { border-color: hsl(176deg, 42%, 54%); color: hsl(176deg, 42%, 54%); } .mdl-dashboard-button--secondary-ghost:hover, .mdl-dashboard-button--secondary-ghost:active { border-color: hsl(176deg, 42%, 54%); color: hsl(176deg, 42%, 54%); } .mdl-dashboard-button--neutral { background: hsl(0deg, 0%, 100%); color: #b3b3b3; border-color: #e6e6e6; } .mdl-dashboard-button--neutral:hover, .mdl-dashboard-button--neutral:active, .mdl-dashboard-button--neutral.-active { background: hsl(0deg, 0%, 100%); border-color: #e6e6e6; color: #333333; } .mdl-dashboard-button--neutral-ghost { border-color: #e6e6e6; color: #b3b3b3; } .mdl-dashboard-button--neutral-ghost:hover:not([disabled]), .mdl-dashboard-button--neutral-ghost:active { border-color: #e6e6e6; color: #333333; } .mdl-dashboard-button--icon-only { line-height: 0; min-width: auto; } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-button--icon-only { width: auto; } } .mdl-dashboard-button--icon-only .fa { margin: 0; } .mdl-dashboard-button--mini { min-width: 2.125rem; padding: 0.3125rem; font-size: 10; text-transform: inherit; } .mdl-dashboard-button--mini .fa { height: 10; width: 10; } .mdl-dashboard-button--mini .fa svg { right: 0.3125rem; } .mdl-dashboard-button--mini.mdl-dashboard-button--has-icon { padding-right: 0.3125rem; } .mdl-dashboard-button--maxi { min-width: 6.375rem; max-width: 100%; padding: 2.5rem; font-size: 14; } .mdl-dashboard-button--maxi .fa { height: 6.375rem; width: 6.375rem; } .mdl-dashboard-button--maxi .fa svg { right: 2.5rem; } .mdl-dashboard-button--maxi.mdl-dashboard-button--has-icon { padding-right: 2.5rem; } .mdl-dashboard-button--danger { background: hsl(355.78deg, 57.14%, 50%); } .mdl-dashboard-button--icon-only { transition: color 0.3s ease-in-out; } .mdl-dashboard-button--icon-only:disabled { filter: grayscale(1); } .mdl-dashboard-button--icon-only.mdl-dashboard-button--danger { background: none; } .mdl-dashboard-button--icon-only.mdl-dashboard-button--danger .fa { color: #4d4d4d; } .mdl-dashboard-button--icon-only.mdl-dashboard-button--danger:hover .fa { color: hsl(355.78deg, 57.14%, 50%); } .mdl-dashboard-button--has-icon:not(.mdl-dashboard-button--icon-only) .icomoon { position: relative; top: 3px; } .mdl-dashboard-button--is-busy span:not(.fa) { visibility: hidden; } .mdl-dashboard-button__spinner { position: absolute; top: 33%; left: 30%; animation-duration: 1s; animation-name: rotate; animation-iteration-count: infinite; } .mdl-dashboard-button--joined { border-left-width: 0; } .mdl-dashboard-button--joined:first-of-type { border-left-width: 1px; } .mdl-dashboard-button--joined + .mdl-dashboard-button--joined { margin-left: 0 !important; } .mdl-dashboard-button__joined-container > *:not(:first-child) { margin-left: -1px; } .mdl-dashboard-button--link { margin: 0; padding: 0; font-weight: normal; color: var(--color-link); } .mdl-dashboard-button--link:hover:not([disabled]) { color: var(--color-link); } .mdl-dashboard-button--link:hover:not([disabled]) *:not(.fa) { text-decoration: underline; } .mdl-dashboard-button.mdl-dashboard-filter__option-button-disabled { color: #aaa; background: #fff; font-style: italic; } .mdl-dashboard-button.mdl-dashboard-filter__option-button-disabled:hover { color: #aaa; } .mdl-dashboard-card { display: flex; flex-flow: column; width: 100%; margin-bottom: 1.25rem; background: hsl(0deg, 0%, 100%); border: 1px solid #e6e6e6; border-radius: 18px; } .mdl-dashboard-card-container, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer { display: flex; flex-flow: row wrap; justify-content: space-between; padding: 0 0 1.25rem; overflow: visible !important; outline: none; } .mdl-dashboard-card-container:after, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer:after { content: ""; } @media screen and (min-width: 993px) { .mdl-dashboard-card-container:after, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer:after { width: calc(33.33% - 0.3125rem); } } .mdl-dashboard-card-container--has-selections .mdl-dashboard-card, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--has-selections .mdl-dashboard-card { transition: box-shadow 0.3s; } .mdl-dashboard-card-container--has-selections .mdl-dashboard-card__bulk-toggle, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--has-selections .mdl-dashboard-card__bulk-toggle { opacity: 1; } .mdl-dashboard-card-container--has-selections .mdl-dashboard-card--selected, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--has-selections .mdl-dashboard-card--selected { box-shadow: 0 0 0 2px var(--color-button) !important; } .mdl-dashboard-card-container--has-selections .mdl-dashboard-card--selected.mdl-dashboard-card--rolled, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--has-selections .mdl-dashboard-card--selected.mdl-dashboard-card--rolled { box-shadow: none; border: 2px solid var(--color-button); z-index: 1; } .mdl-dashboard-card-container--has-selections .mdl-dashboard-card--rolled .mdl-dashboard-dropdown, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--has-selections .mdl-dashboard-card--rolled .mdl-dashboard-dropdown { display: none; } .mdl-dashboard-card-container--rolled, .mdl-dashboard-card-container--row, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--rolled, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--row { flex-flow: column; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer { display: block; width: 100% !important; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div { width: calc(33.33333% - 10px) !important; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div.mdl-dashboard-card--index-1, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div.mdl-dashboard-card--index-1 { left: calc(33.33% + 5px) !important; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div.mdl-dashboard-card--index-2, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div.mdl-dashboard-card--index-2 { left: calc(66.66% + 10px) !important; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card { height: calc(100% - 20px); min-height: calc(100% - 20px); max-height: calc(100% - 20px); } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card__image-container, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card__image-container { min-height: unset; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card > div, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card > div { position: relative; overflow: hidden; } .mdl-dashboard-card-container--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card > div:after, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer--grid .ReactVirtualized__Grid__innerScrollContainer > div .mdl-dashboard-card > div:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 20px; background: linear-gradient(to top, #FFF 0%, rgba(255, 255, 255, 0) 100%); } .mdl-dashboard-card-container .mdl-dashboard-card, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card { position: relative; flex: auto; flex-grow: 0; margin: 0 0 1.25rem 0; overflow: visible !important; } .mdl-dashboard-card-container .mdl-dashboard-card--grid, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--grid { transition: none; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled, .mdl-dashboard-card-container .mdl-dashboard-card--row, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--row { width: 100%; flex-flow: row; flex-wrap: wrap; margin: 0 0 20px 0; } .mdl-dashboard-card-container .mdl-dashboard-card--offset-rolled, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--offset-rolled { margin: 0; } .mdl-dashboard-card-container .mdl-dashboard-card--is-first, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--is-first { margin: 0 0 20px 0; } .mdl-dashboard-card-container .mdl-dashboard-card--row.transitioning, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--row.transitioning { overflow: hidden; } .mdl-dashboard-card-container .mdl-dashboard-card--row > div, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--row > div { display: flex; flex-direction: column; width: calc(100% - 300px); } .mdl-dashboard-card-container .mdl-dashboard-card--rolled, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled { margin: 0; align-items: center; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled + .mdl-dashboard-card--rolled:not(.mdl-dashboard-card--selected), .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled + .mdl-dashboard-card--rolled:not(.mdl-dashboard-card--selected) { border-top: 0; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled.mdl-dashboard-card--selected + .mdl-dashboard-card--selected, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled.mdl-dashboard-card--selected + .mdl-dashboard-card--selected { border-top: 0; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled + .mdl-dashboard-card--row, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled + .mdl-dashboard-card--row { margin-top: 1.25rem; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled.-start-roll, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled.-start-roll { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; } .mdl-dashboard-card-container .mdl-dashboard-card--rolled.-mid-roll, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled.-mid-roll { border-top: 1px solid #65788B !important; border-radius: 0 !important; box-shadow: -2px 10px 10px rgba(0, 0, 0, 0.05), 2px 10px 10px rgba(0, 0, 0, 0.05); } .mdl-dashboard-card-container .mdl-dashboard-card--rolled.-end-roll, .mdl-dashboard-card-container .ReactVirtualized__Grid__innerScrollContainer .mdl-dashboard-card--rolled.-end-roll { border-top: 1px solid #65788B !important; border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; box-shadow: 0 8px 10px rgba(0, 0, 0, 0.1); } .mdl-dashboard-card-wrapper { margin: 0; background: #f2f2f2; } .mdl-dashboard-card-scroller { display: flex; overflow-x: scroll; } .mdl-dashboard-card--feature { min-width: 40%; } .mdl-dashboard-card--closed { background: #f2f2f2; } .mdl-dashboard-card__body { display: flex; flex-direction: column; padding: 16px; padding-bottom: 0; height: auto; border: 0; text-align: left; } .mdl-dashboard-card--row .mdl-dashboard-card__body { min-height: unset; flex-direction: column; flex: 1; } .mdl-dashboard-card__body-content { min-height: 130px; } .mdl-dashboard-card--row .mdl-dashboard-card__body-content { min-height: 0; min-height: unset; max-height: 130px; } .mdl-dashboard-card__body-content a, .mdl-dashboard-card__body-content a:hover { color: inherit; text-decoration: none; } .mdl-dashboard-card__body-content:hover { cursor: pointer; } .mdl-dashboard-card__body-content p:last-of-type { margin-bottom: 0; } .mdl-dashboard-card__image-container { position: relative; min-height: 75px; } .mdl-dashboard-card--row .mdl-dashboard-card__image-container { max-width: 282px; min-width: 282px; min-height: unset; height: 169px; order: 1; margin-left: auto; } .mdl-dashboard-card__status-labels { margin-top: auto; } .mdl-dashboard-card__status-labels-label { display: inline-block; border-radius: 4px; padding: 0.3125rem; margin: 0 0.3125rem 0.3125rem 0; font-size: 12px; line-height: 12px; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-container { width: 100%; flex-basis: 100%; } .mdl-dashboard-card--rolled .mdl-dashboard-card__meta-container { display: flex; width: auto; flex-basis: auto; margin-left: auto; margin-right: 0.625rem; align-items: center; } .mdl-dashboard-card--rolled .mdl-dashboard-card__meta-container > * { margin-left: 0.625rem; } .mdl-dashboard-card--rolled .mdl-dashboard-card__meta-container p { margin: 0; } .mdl-dashboard-card__meta-container .mdl-dashboard-dropdown { min-width: 30px; } .mdl-dashboard-card__meta-container .mdl-dashboard-dropdown--icon-trigger { z-index: 100; margin-left: auto; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-container .mdl-dashboard-dropdown--icon-trigger { margin-left: 0; } .mdl-dashboard-card--rolled .mdl-dashboard-dropdown--icon-trigger { z-index: unset; top: 0; right: auto; } .mdl-dashboard-card--rolled .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-button { border-radius: 50%; } .mdl-dashboard-card__meta-container .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-button { position: absolute; right: 0; background: hsl(0deg, 0%, 100%); border-radius: 50%; } .mdl-dashboard-card__meta-container .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav { position: absolute; top: auto; right: 0; min-width: 120px; max-width: 200px; width: auto; transform: translateX(0); } .mdl-dashboard-card__meta-author { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-author { overflow: visible; } .mdl-dashboard-card__meta-campaign { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-campaign { overflow: visible; } .mdl-dashboard-card--rolled .mdl-dashboard-card__meta-campaign { display: none; } .mdl-dashboard-card__meta-campaign .mdl-button.-flat { text-align: left; display: inline; } .mdl-dashboard-card__meta-status { display: flex; flex-wrap: wrap; align-items: center; top: 0; width: 100%; padding: 0.425rem 0.625rem; color: #444; border-bottom: 1px solid #e6e6e6; } .mdl-dashboard-card--rolled .mdl-dashboard-card__meta-status { width: auto; border-bottom: none; } .mdl-dashboard-card__meta-status .fa { height: 1.225rem; width: 1.225rem; } .mdl-dashboard-card__meta-status__stage { margin: 0 auto; } .mdl-dashboard-card__meta-status__stage-actions { display: none; flex-wrap: wrap; margin: 0 1.25rem 0 auto; width: 100%; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-status__stage-actions { display: flex; width: auto; } .mdl-dashboard-card__meta-status__stage-actions-item { list-style: none; margin-left: 1rem; line-height: 1rem; } .mdl-dashboard-card__meta-status__stage-actions-item .mdl-dashboard-button { color: var(--color-link); font-weight: normal; } .mdl-dashboard-card__meta-status__stage-actions-item .mdl-dashboard-button:hover { color: var(--color-link); text-decoration: underline; } .mdl-dashboard-card__meta-image { width: 100%; vertical-align: middle; } .mdl-dashboard-card--row .mdl-dashboard-card__meta-image { min-width: 100%; } .mdl-dashboard-card__meta-image:hover { cursor: pointer; } .mdl-dashboard-card__meta-end-time { position: absolute; top: 0.625rem; left: 50%; transform: translateX(-50%); background: hsl(0deg, 0%, 100%); padding: 0.3125rem; border-radius: 4px; } .mdl-dashboard-card__meta-stage ~ .mdl-dashboard-card__meta-end-time { top: 2.5rem; } .mdl-dashboard-card__meta-themes { display: flex; flex-wrap: wrap; position: absolute; bottom: 0.625rem; right: 0.625rem; } .mdl-dashboard-card__meta-theme { background: hsl(0deg, 0%, 100%); padding: 0.3125rem; border: 1px solid #cccccc; border-radius: 4px; margin: 0.3125rem; margin-top: 0; } .mdl-dashboard-card__meta-reported { position: absolute; top: 0; right: 0; text-align: center; } .mdl-dashboard-card__meta-reported:before { content: ""; position: absolute; right: 0; top: 0; width: 0; height: 0; border-style: solid; border-width: 0 2.5rem 2.5rem 0; border-color: transparent hsl(355.78deg, 57.14%, 50%) transparent transparent; } html[dir=rtl] .mdl-dashboard-card__meta-reported { right: auto; left: 0; } .mdl-dashboard-card__meta-reported .fa { position: relative; top: 4px; width: 1rem; height: 1rem; color: lightness-aware-text(hsl(355.78deg, 57.14%, 50%)); } .mdl-dashboard-card__title { display: flex; align-items: center; } .mdl-dashboard-card__header { position: relative; } .mdl-dashboard-card--row .mdl-dashboard-card__header { flex-direction: row; } .mdl-dashboard-card__header-title-container { padding: 16px 16px 0; transition: all 0.3s; } .mdl-dashboard-card__header-title { font-size: 22px; font-weight: 400; line-height: 2rem; margin-bottom: 0; padding-bottom: 0; } .mdl-dashboard-card--rolled .mdl-dashboard-card__header-title { display: inline-block; font-size: 16px; font-weight: 400; line-height: 1rem; } .mdl-dashboard-card--unread .mdl-dashboard-card__header-title { font-weight: 600; } .mdl-dashboard-card__header-title a, .mdl-dashboard-card__header-title a:hover { color: inherit; text-decoration: none; } .mdl-dashboard-card__header-title:hover { cursor: pointer; } .mdl-dashboard-card__header-sub-title { font-size: 10px; font-weight: 400; color: #b3b3b3; } .mdl-dashboard-card__header-sub-title a { text-decoration: none; } .mdl-dashboard-card__user-image { margin-right: 0.625rem; } .mdl-dashboard-card__user-image img { min-width: 20px; width: 20px; min-height: 20px; height: 20px; border-radius: 50%; } .mdl-dashboard-card__footer { display: flex; flex-flow: column; margin-top: auto; padding: 16px; border: 0; border-top: 1px solid #e6e6e6; text-align: left; } .mdl-dashboard-card--row .mdl-dashboard-card__footer { order: 4; width: 100%; flex-basis: 100%; max-width: 100%; flex-flow: row; margin-top: 0; margin-left: auto; } html[dir=rtl] .mdl-dashboard-card--row .mdl-dashboard-card__footer { margin-left: 0; margin-right: auto; } .mdl-dashboard-card__footer--rows { flex-flow: row; position: relative; } .mdl-dashboard-card__footer--rows:before { content: ""; width: 100%; position: absolute; top: 0; left: 0; } .mdl-dashboard-card__footer--cols { flex-flow: column; } .mdl-dashboard-card__footer--cols > * { margin-top: 0.625rem; } .mdl-dashboard-card__footer--cols .mdl-dashboard-card__footer-stats { padding: 1.25rem 0; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #cccccc; } .mdl-dashboard-card__footer--cols .mdl-dashboard-card__footer-stat { text-align: center; } .mdl-dashboard-card__footer--cols .mdl-dashboard-card__footer-action { margin-top: 1.25rem; } .mdl-dashboard-card--row .mdl-dashboard-card__footer--cols .mdl-dashboard-card__footer-action { margin-top: 0; } .mdl-dashboard-card__footer-about { display: flex; align-items: center; } .mdl-dashboard-card--row .mdl-dashboard-card__footer-about { max-width: 70%; } .mdl-dashboard-card__footer-about p { margin-bottom: 0; overflow: hidden; } .mdl-dashboard-card--row .mdl-dashboard-card__footer-about p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mdl-dashboard-card--row .mdl-dashboard-card__footer-about p span { display: inline; } .mdl-dashboard-card__footer-about p span { display: inline-block; } .mdl-dashboard-card__footer-stats { display: flex; justify-content: center; align-items: center; width: 90%; margin: 0.625rem auto 0; color: #949494; } .mdl-dashboard-card__footer-stats .mdl-icon { color: #949494; } .mdl-dashboard-card--row .mdl-dashboard-card__footer-stats { margin: 0; margin-left: auto; width: 28%; } .mdl-dashboard-card--rolled .mdl-dashboard-card__footer-stats { margin: 0; } .mdl-dashboard-card--rolled .mdl-dashboard-card__footer-stats .mdl-dashboard-card__footer-stat { margin-right: 20px; text-align: left; } .mdl-dashboard-card--rolled .mdl-dashboard-card__footer-stats .mdl-dashboard-card__footer-stat:last-of-type { margin-right: 0; } .mdl-dashboard-card__footer-stat { flex: 1; display: flex; justify-content: center; align-items: center; } .mdl-dashboard-card__footer-stat .fa { height: auto; width: auto; margin-right: 5px; font-size: 18px; } .mdl-dashboard-card__footer-stat .mdl-icon.-s { min-width: 16px; } .mdl-dashboard-card--rolled .mdl-dashboard-card__footer-stat .mdl-dashboard-card__footer-stat-count { display: inline-block; width: 25px; } .mdl-dashboard-card__footer-action { padding-right: 1.25rem; } .mdl-dashboard-card__footer-action .fa { position: absolute; left: auto; right: 0.3125rem; top: 50%; transform: translateY(-50%); } html[dir=rtl] .mdl-dashboard-card__footer-action .fa { right: auto; left: 0.3125rem; transform: translateY(-50%) rotate(180deg); } .mdl-dashboard-card--row .mdl-dashboard-card__footer-action { align-self: center; } .mdl-dashboard-card:hover .mdl-dashboard-card__bulk-toggle { opacity: 1; } .mdl-dashboard-card__bulk-toggle { opacity: 0; position: absolute; top: calc(2.5rem + 20px); right: 0.625rem; height: 30px; width: 30px; border-radius: 50%; z-index: 99; box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } .mdl-dashboard-card--rolled .mdl-dashboard-card__bulk-toggle { top: 0; right: auto; position: relative; } .mdl-dashboard-card__bulk-toggle:after { opacity: 0.5; content: ""; width: 12px; height: 6px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -66%) rotate(-45deg); border: 3px solid #2C3548; border-top: none; border-right: none; } .mdl-dashboard-card__bulk-toggle svg { pointer-events: none; } .mdl-dashboard-card__bulk-toggle:hover { background: #EFF1FA !important; } .mdl-dashboard-card__bulk-toggle.--active { opacity: 1; } .mdl-dashboard-card__bulk-toggle.--active:after { opacity: 1; } .mdl-dashboard-card__bulk-toggle-message { display: none; position: absolute; top: 100px; left: 0; margin: 0.3125rem; padding: 0.625rem; background: hsl(0deg, 0%, 100%); z-index: 200; box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } .mdl-dashboard-card--row .mdl-dashboard-card__bulk-toggle-message { left: auto; right: 0; } .mdl-dashboard-card__bulk-toggle-message:before { content: " "; position: absolute; top: calc(-0.625rem + 1px); right: calc(0.625rem + 1px); width: 0; height: 0; border: 0.625rem solid transparent; border-top: none; border-bottom-color: hsl(0deg, 0%, 100%); filter: drop-shadow(0px -6px 5px rgba(26, 26, 26, 0.25)); } html[dir=rtl] .mdl-dashboard-card__bulk-toggle-message:before { left: calc(0.625rem + 1px); right: auto; } .mdl-dashboard-card--unselectable { opacity: 0.5; filter: grayscale(1); } .mdl-dashboard-card--unselectable .mdl-dashboard-card__bulk-toggle:after { content: ""; background: transparent url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224%22%20width%3D%2224%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M0%200h16v16H0z%22%2F%3E%3Cpath%20d%3D%22M3.5%203.5l9%209m0-9l-9%209%22%20stroke%3D%22%232C3548%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22square%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") no-repeat left center; border: 0; transform: translate(-50%, -50%); height: 24px; width: 24px; opacity: 0.5; } .mdl-dashboard-card--unselectable .mdl-dashboard-card__bulk-toggle:hover + .mdl-dashboard-card__bulk-toggle-message { display: block; opacity: 1; } .mdl-dashboard-card--unread { border: 2px solid #444; } .mdl-dashboard-card--unread.mdl-dashboard-card--rolled { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; border-left: 2px solid #444; border-right: 2px solid #444; } .mdl-dashboard-card__roll-toggle { margin: 0 0.625rem 0 0; padding: 0; } .mdl-dashboard-card__roll-toggle .fa { line-height: 1.225rem; font-size: 0.8rem; } .mdl-dashboard-card--rolled .mdl-dashboard-card__roll-toggle { height: auto; } .mdl-dashboard-card--rolled .mdl-dashboard-card__roll-toggle .fa { line-height: 1.225rem; width: 1.25rem; transform: rotate(180deg); } .mdl-dashboard-card__col { flex: 1; flex-direction: row; padding: 0.625rem; } .mdl-dashboard-card__col--1 { flex-basis: 10%; } .mdl-dashboard-card__col--2 { flex-basis: 20%; } .mdl-dashboard-card__col--3 { flex-basis: 30%; } .mdl-dashboard-card__col--4 { flex-basis: 40%; } .mdl-dashboard-card__col--fit { flex-basis: content; } .mdl-dashboard-card__col--right { text-align: right; margin-left: auto; } .mdl-dashboard-card__col--float { display: none; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 100px; padding: 0 0.625rem; z-index: 1; } .mdl-dashboard-card--selected .mdl-dashboard-card__col--float, .mdl-dashboard-card--rolled:hover .mdl-dashboard-card__col--float { display: flex; } .mdl-dashboard-card--selected .mdl-dashboard-card__col--float > *:last-child, .mdl-dashboard-card--rolled:hover .mdl-dashboard-card__col--float > *:last-child { margin-left: auto; } .transitioning .mdl-dashboard-card__col--float { opacity: 0; } .mdl-dashboard-card__col p { margin: 0; } .mdl-dashboard-card__col > .fa { height: 1rem; width: 1.5rem; } .mdl-dashboard-dropdown { position: relative; display: inline-block; } .mdl-dashboard-dropdown + .mdl-dashboard-dropdown { margin-left: 0.625rem; } html[dir=rtl] .mdl-dashboard-dropdown + .mdl-dashboard-dropdown { margin-left: 0; margin-right: 0.625rem; } .mdl-dashboard-dropdown__button:hover, .mdl-dashboard-dropdown__button.-is-active { background: hsl(0deg, 0%, 100%); outline: 0; } .mdl-dashboard-dropdown__button:hover .fa, .mdl-dashboard-dropdown__button.-is-active .fa { transform: translateY(-50%) rotate(180deg); } .mdl-dashboard-dropdown__button.mdl-dashboard-button--has-icon { padding: 0.625rem; padding-right: 2.225rem; } .mdl-dashboard-dropdown--icon-trigger { text-align: right; } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__button { box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__button .fa { top: 50%; left: 50%; right: auto; transform: translate(-50%, -50%); } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__button.-is-active .fa { transform: translate(-50%, -50%) rotate(0deg); } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav { top: auto; width: 150px; right: calc(78px - 0.625rem); transform: translateX(50%); margin-top: 2px; border: 1px solid #e6e6e6; border-radius: 8px; box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } html[dir=rtl] .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav { left: calc(-75px + 0.625rem); } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav:before { content: " "; position: absolute; top: calc(-0.625rem + 1px); right: calc(0.625rem + 1px); width: 0; height: 0; border: 0.625rem solid transparent; border-top: none; border-bottom-color: hsl(0deg, 0%, 100%); filter: drop-shadow(0px -6px 5px rgba(26, 26, 26, 0.25)); } html[dir=rtl] .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav:before { left: calc(0.625rem + 1px); right: auto; } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav-item:first-of-type .mdl-dashboard-dropdown__nav-link { border-radius: 8px 8px 0 0; } .mdl-dashboard-dropdown--icon-trigger .mdl-dashboard-dropdown__nav-item:only-of-type .mdl-dashboard-dropdown__nav-link { border-radius: 8px; } .mdl-dashboard-dropdown__nav { position: absolute; width: 100%; padding: 0.3125rem 0; background: hsl(0deg, 0%, 100%); border: 1px solid #e6e6e6; border-top: 0; border-radius: 0 0 0px 0px; text-align: left; z-index: 900; } html[dir=rtl] .mdl-dashboard-dropdown__nav { text-align: right; } .mdl-dashboard-dropdown__nav ul { margin: 0; padding: 0; } .mdl-dashboard-dropdown__nav-item { list-style: none; } .mdl-dashboard-dropdown__nav-item:last-of-type .mdl-dashboard-dropdown__nav-link { border-radius: 0 0 0px 0px; } .mdl-dashboard-dropdown__nav-item--separator:after { content: ""; display: block; width: 90%; max-height: 0; height: 0; margin: 0 auto; border-bottom: 1px solid #e6e6e6; } .mdl-dashboard-dropdown__nav-link { display: block; padding: 0 0.625rem; text-decoration: none; } .mdl-dashboard-dropdown__nav-link--danger { color: black; } .mdl-dashboard-dropdown__nav-link--danger:hover { background: hsl(355.78deg, 57.14%, 50%); color: black; } .mdl-dashboard-filter { display: flex; flex-wrap: wrap; max-width: 980px; margin: 16px auto 16px; align-items: stretch; border-radius: 18px; font: 400 14px / 1.3 "Nunito" , -apple-system , BlinkMacSystemFont , helvetica , arial , sans-serif; } @media screen and (min-width: 0px) and (max-width: 480px) { .mdl-dashboard-filter { flex-direction: column; } } .mdl-dashboard-filter:first-of-type { margin-top: 16px; } .mdl-dashboard-filter--isolated { padding: 16px; } .mdl-dashboard-filter--isolated .mdl-form__input.-select.-inline-select-value { padding-right: 60px; } .mdl-dashboard-filter--isolated .mdl-form__input.-select.-inline-select-value.-no-badge { padding-right: 30px; } .mdl-dashboard-filter__filters-wrapper { display: flex; flex-wrap: wrap; align-items: center; order: 1; } .mdl-dashboard-filter__filters-wrapper .mdl-dashboard-button { height: 2.5rem; } .mdl-dashboard-filter__filters-wrapper.mdl-dashboard-form { width: auto; } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-filter__filters-wrapper.mdl-dashboard-form { width: 100%; } } .mdl-dashboard-filter__filters-wrapper .mdl-dashboard-form__field--inline { padding: 0; } @media screen and (min-width: 0px) and (max-width: 768px) { .mdl-dashboard-filter__filters-wrapper.--active { margin: 0.625rem 0; padding: 0; display: flex; } .mdl-dashboard-filter__filters-wrapper.--active > * { margin-right: 1rem; margin-left: 0; } } .mdl-dashboard-filter__filters-wrapper--right { margin-left: auto; } .mdl-dashboard-filter__sort-wrapper { display: flex; flex: 1; justify-content: flex-end; text-align: right; order: 4; } html[dir=rtl] .mdl-dashboard-filter__sort-wrapper { margin-right: auto; } @media screen and (min-width: 0px) and (max-width: 768px) { .mdl-dashboard-filter__sort-wrapper { flex-wrap: wrap; width: 50%; order: 2; } } .mdl-dashboard-filter__options { position: absolute; max-width: 18.75rem; margin-top: 0.625rem; padding: 0.625rem; background: hsl(0deg, 0%, 100%); border-radius: 8px; z-index: 900; box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } .mdl-dashboard-filter__options:before { content: " "; position: absolute; top: calc(-0.625rem + 1px); left: calc(0.625rem + 1px); width: 0; height: 0; border: 0.625rem solid transparent; border-top: none; border-bottom-color: hsl(0deg, 0%, 100%); filter: drop-shadow(0px -6px 5px rgba(26, 26, 26, 0.25)); } html[dir=rtl] .mdl-dashboard-filter__options:before { right: calc(0.625rem + 1px); left: auto; } .mdl-dashboard-filter__options .mdl-dashboard-button { font-weight: normal; border-radius: 0px; line-height: 1rem; } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-filter__options { left: 0.625rem; width: calc(100% - 1.25rem); max-width: 100%; justify-content: unset; } .mdl-dashboard-filter__options:before { display: none; } } .mdl-dashboard-filter__options-items { margin: 0; list-style: none; max-height: 450px; overflow: auto; } .mdl-dashboard-filter__options-item--child { display: flex; position: relative; padding-left: calc(1.25rem + 4px); } .mdl-dashboard-filter__options-item--child:before { content: ""; display: block; position: absolute; bottom: 50%; left: calc(0.625rem - 2px); width: 0.625rem; height: 100%; border: 1px solid #65788B; border-right: 0; border-top: 0; } .mdl-dashboard-filter__options-item:not(.mdl-dashboard-filter__options-item--child) + .mdl-dashboard-filter__options-item--child:before { height: 1.25rem; } .mdl-dashboard-filter__filter { flex-flow: row; margin: 0 0.625rem 0 0; } .mdl-dashboard-filter__filter-button, .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button { padding-right: 4.1rem; background-color: hsl(0deg, 0%, 100%); border: 1px solid #e6e6e6; border-radius: 0px; min-width: 7.8125rem; max-width: 14rem; text-align: left; color: #65788B; font-weight: normal; } html[dir=rtl] .mdl-dashboard-filter__filter-button, html[dir=rtl] .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button, .mdl-dashboard-filter__sort-wrapper html[dir=rtl] .mdl-dashboard-dropdown__button { padding-right: 0.625rem; padding-left: 4.1rem; text-align: right; } .mdl-dashboard-filter__filter-button .fa, .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button .fa { position: absolute; right: 0.625rem; color: #b3b3b3; top: 50%; transform: translateY(-50%); transition: all 0.3s ease-in-out; } html[dir=rtl] .mdl-dashboard-filter__filter-button .fa, html[dir=rtl] .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button .fa, .mdl-dashboard-filter__sort-wrapper html[dir=rtl] .mdl-dashboard-dropdown__button .fa { right: auto; left: 0.625rem; } .mdl-dashboard-filter__filter-button--active { background-color: hsl(0deg, 0%, 100%); } .mdl-dashboard-filter__filter-button:hover, .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button:hover { background-color: hsl(0deg, 0%, 100%); } .mdl-dashboard-filter__option-button { display: block; width: 100%; padding-left: 1.25rem; margin: 0.3125rem; margin-left: 0; margin-top: 0; font-weight: normal; text-align: left; } .mdl-dashboard-filter__option-button:focus { outline: revert; } .mdl-dashboard-filter__option-button:before { content: ""; width: 16px; height: 16px; background: transparent url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20height%3D%2224%22%20width%3D%2224%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%228%22%20r%3D%224%22%20fill%3D%22none%22%20stroke-width%3D%221.5%22%20stroke%3D%22%23778FAE%22%2F%3E%3C%2Fsvg%3E") no-repeat left center; background-size: 16px; display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .mdl-dashboard-filter__option-button.-multiple:before { background-image: url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20height%3D%2224%22%20width%3D%2224%22%3E%3Cpath%20fill%3D%22none%22%20stroke-width%3D%221.5%22%20stroke%3D%22%23778FAE%22%20stroke-linejoin%3D%22round%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%221%22%20d%3D%22M4%204h8v8H4z%22%2F%3E%3C%2Fsvg%3E"); } .mdl-dashboard-filter__option-button.mdl-dashboard-button { height: auto; } .mdl-dashboard-filter__option-button + .mdl-dashboard-filter__option-button { margin-left: 0; } .mdl-dashboard-filter__option-button:hover { background: none; color: inherit; } .mdl-dashboard-filter__option-button-badge { right: 0 !important; } .mdl-dashboard-filter__option-button.-is-selected:before { content: ""; background-image: url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224%22%20width%3D%2224%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20d%3D%22M0%200h16v16H0z%22%2F%3E%3Cpath%20fill%3D%22%23778FAE%22%20fill-rule%3D%22nonzero%22%20d%3D%22M13.01%203l-7.075%207.833L2.99%207.57%202%208.668l3.44%203.81.495.523.495-.524L14%204.096z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } .mdl-dashboard-filter__option-button.-selected-dim:hover:before { color: inherit; content: ""; background-image: url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%20height%3D%2224%22%20width%3D%2224%22%3E%3Ccircle%20cx%3D%228%22%20cy%3D%228%22%20r%3D%224%22%20fill%3D%22none%22%20stroke-width%3D%221.5%22%20stroke%3D%22%23778FAE%22%2F%3E%3C%2Fsvg%3E"); } .mdl-dashboard-filter__option-label { border-radius: 8px; padding: 4px; font-size: 12px; line-height: 12px; } .mdl-dashboard-filter__filter-badge { color: var(--color-button); padding-left: 12px; } html[dir=rtl] .mdl-dashboard-filter__filter-badge { right: auto; left: 2.25rem; } .mdl-dashboard-filter .mdl-dashboard-form__search-form { width: 50%; order: 2; margin-left: auto; min-width: 80px; } .mdl-dashboard-filter .mdl-dashboard-form__search-form form { position: relative; } @media screen and (min-width: 769px) { .mdl-dashboard-filter .mdl-dashboard-form__search-form { width: calc(15% - 0.3125rem); order: 2; } } .mdl-dashboard-filter .mdl-dashboard-form__search-form .mdl-dashboard-form__field { display: block; padding: 0; } html[dir=rtl] .mdl-dashboard-filter .mdl-dashboard-form__search-form .mdl-dashboard-form__field { padding: 0 0 0 calc(0.625rem - 2px); } .mdl-dashboard-filter .mdl-dashboard-form__search-input { width: 100%; padding-right: 2rem; border-radius: 0px; box-shadow: none; border-color: #e6e6e6; transition: all 0.3s ease-in-out; } .mdl-dashboard-filter .mdl-dashboard-form__search-input:focus { box-shadow: 0px 0px 0px 2px rgba(44, 138, 206, 0.5); } .mdl-dashboard-filter .mdl-dashboard-form__search-button { position: absolute; display: inline-block; width: auto; right: 0; top: 50%; transform: translateY(-50%); } html[dir=rtl] .mdl-dashboard-filter .mdl-dashboard-form__search-button { right: auto; left: 0; } .mdl-dashboard-filter .mdl-dashboard-form__search-button .fa { color: #b3b3b3; } .mdl-dashboard-filter__sort-wrapper .mdl-dashboard-dropdown__button.mdl-dashboard-button--has-icon { padding: calc(0.625rem - 2px) 0.625rem; padding-right: 2.225rem; } @media screen and (min-width: 769px) { .mdl-dashboard-filter__sort-wrapper > .mdl-dashboard-filter__sort-layout-button { margin-left: 0.625rem; } html[dir=rtl] .mdl-dashboard-filter__sort-wrapper > .mdl-dashboard-filter__sort-layout-button { margin-right: 0.625rem; margin-left: 0; } } .mdl-dashboard-filter__sort-layout-button { display: none; font-size: 12px; } @media screen and (min-width: 769px) { .mdl-dashboard-filter__sort-layout-button { display: inline-block; } .mdl-dashboard-filter__sort-layout-button + .mdl-dashboard-filter__sort-layout-button { margin: 0; } } .mdl-dashboard-filter__sort-layout-button .mdl-form__item { margin-bottom: 0 !important; } @media screen and (min-width: 769px) { .mdl-dashboard-filter__toggle-button { display: none; } } .mdl-dashboard-filter__meta { margin-bottom: 0; font-weight: 500; font-size: 18px; } .mdl-dashboard-filter .mdl-dashboard-form__label { font-size: 12px; } .mdl-dashboard-filter__button { height: 2.625rem; } .refresh-button-border { border-left: 1px solid #e6e6e6; padding-left: 10px; } .-select.remove { background-position-x: calc(100% - 25px); padding-right: 65px !important; } .remove-icon { position: absolute; right: 6px; top: 6px; background: transparent; border-radius: 50%; border: 1px solid #8C93AB; height: 20px; width: 20px; } .remove-icon .mdl-icon { width: 10px; height: 10px; top: -1px; position: relative; } .mdl-form__input.remove .mdl-dashboard-filter__filter-badge { display: block; position: absolute; right: 46px; top: 50%; transform: translateY(-50%); color: var(--color-button); text-align: center; } .mdl-form__input.remove .mdl-dashboard-filter__filter-badge.-inline-badge { display: inline-block; line-height: 1; max-width: 330px; overflow: hidden; position: relative; right: -8px; text-overflow: ellipsis; top: 9px; } .dashboard-filter-container .mdl-dashboard-filter__filters-wrapper.mdl-dashboard-form { width: 77%; } .mdl-dashboard-filter__filters-wrapper.mdl-dashboard-form { width: auto; padding: 10px 0 0; } .dashboard-filter-container .search-box-container { display: flex; -ms-flex-wrap: wrap; order: 2; width: 23%; margin: 10px 0; align-items: stretch; } .dashboard-filter-container.mdl-dashboard-filter .mdl-dashboard-form__search-form { width: calc(70% - 0.3125rem); order: 2; border-left: 1px solid #8C93AB; padding-left: 10px; } .dashboard-filter-container .mdl-dashboard-filter__filter, .dashboard-filter-container .mdl-dashboard-filter__filter + .mdl-dashboard-filter__filter { margin-bottom: 10px; } .dashboard-filter-container .mdl-dashboard-filter__filter .icon-style:disabled { color: #CED4DA; border: 1px solid #8C93AB; } .mdl-dashboard-filter__options-items.-margin-bottom { margin-bottom: 15px !important; } .dashboard-filter-container.mdl-dashboard-filter .filters-search .mdl-dashboard-form__search-form { width: 100%; } .filters-search { margin: 10px 0; } .dashboard-filter-container.mdl-dashboard-filter .filters-search .mdl-dashboard-form__search-form { padding: 0; border: none; } .filters-search input#filterSearch { border-radius: 0; box-shadow: none; border-bottom: 1px solid #8C93AB; outline: none !important; } .filters-search input#filterSearch:hover { outline: none !important; } .hideElement { display: none; } .mdl-button.reset-button { border: 0; background: transparent; order: 2; } .mdl-button.reset-button span { border-bottom: 1px solid var(--color-button); } .dashboard-filter-container .mdl-dashboard-filter__filter .icon-style { color: var(--color-button); border: 1px solid var(--color-button); box-shadow: none; } .dashboard-filter-container .mdl-dashboard-filter__filter .icon-style span { top: -0.5px; position: relative; } .dashboard-filter-container .mdl-moderator__filter .icon-style { padding: 7px 8px; } .mdl-dashboard-filter__filter.mdl-dashboard-filter__filter { margin: 0 0.625rem 0.625rem 0; } .no-space-dropdown { padding: 0 0 10px; } .no-space-dropdown .dropdown-options { padding: 0 10px; } .dropdown-buttons { padding: 0 10px; } .no-space-dropdown .search-btn-mrg { margin: 0 10px; } .mdl-dashboard-form { width: 100%; margin: 0; padding: 0; } .mdl-dashboard-form--full-width .mdl-dashboard-form__field, .mdl-dashboard-form--half-width .mdl-dashboard-form__field { display: block; } .mdl-dashboard-form--full-width .mdl-dashboard-form__field--joined, .mdl-dashboard-form--half-width .mdl-dashboard-form__field--joined { display: inline-block; } .mdl-dashboard-form--full-width .mdl-dashboard-form__input, .mdl-dashboard-form--half-width .mdl-dashboard-form__input { width: 100%; } .mdl-dashboard-form--full-width .mdl-dashboard-form__label--contain, .mdl-dashboard-form--half-width .mdl-dashboard-form__label--contain { width: 100%; } .mdl-dashboard-form--full-width .mdl-dashboard-form__label--contain .mdl-dashboard-form__input, .mdl-dashboard-form--half-width .mdl-dashboard-form__label--contain .mdl-dashboard-form__input { width: auto; } .mdl-dashboard-form--half-width { width: 100%; } @media screen and (min-width: 769px) { .mdl-dashboard-form--half-width { width: 50%; } } .mdl-dashboard-form--linear { display: flex; } .mdl-dashboard-form__field { display: inline-block; position: relative; } .mdl-dashboard-form__field--size-xs.mdl-dashboard-form__field--joined, .mdl-dashboard-form__field--size-xs .mdl-dashboard-form__input { width: 4.375rem; } .mdl-dashboard-form__field--size-s.mdl-dashboard-form__field--joined, .mdl-dashboard-form__field--size-s .mdl-dashboard-form__input { width: 6.25rem; } .mdl-dashboard-form__field--size-m.mdl-dashboard-form__field--joined, .mdl-dashboard-form__field--size-m .mdl-dashboard-form__input { width: 10.9375rem; } .mdl-dashboard-form__field--size-l.mdl-dashboard-form__field--joined, .mdl-dashboard-form__field--size-l .mdl-dashboard-form__input { width: 15.625rem; } .mdl-dashboard-form__field--size-xl.mdl-dashboard-form__field--joined, .mdl-dashboard-form__field--size-xl .mdl-dashboard-form__input { width: 18.75rem; } .mdl-dashboard-form__field--joined { padding-right: 0; white-space: nowrap; overflow: visible; } html[dir=rtl] .mdl-dashboard-form__field--joined { padding-right: auto; padding-left: 0; } .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined { padding-left: 0; margin-left: -5px; } html[dir=rtl] .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined { margin-left: 0; margin-right: -5px; padding-left: inherit; padding-right: 0; } .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined .mdl-dashboard-form__input, .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined .mdl-dashboard-form__select { border-left-width: 0; } html[dir=rtl] .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined .mdl-dashboard-form__input, html[dir=rtl] .mdl-dashboard-form__field--joined + .mdl-dashboard-form__field--joined .mdl-dashboard-form__select { border-right: 0; border-left-width: 1px; } .mdl-dashboard-form__field--joined:last-of-type .mdl-dashboard-form__input, .mdl-dashboard-form__field--joined:last-of-type .mdl-dashboard-form__select { border-right: 1px; } .mdl-dashboard-form__field--joined:last-of-type .mdl-dashboard-form__input html[dir=rtl], .mdl-dashboard-form__field--joined:last-of-type .mdl-dashboard-form__select html[dir=rtl] { border-left-width: 1px; border-right: 0; } .mdl-dashboard-form__field--end { margin-left: auto; } .mdl-dashboard-form__field--end html[dir=rtl] { margin-left: 0; margin-right: auto; } .mdl-dashboard-form__field--separator { display: block; min-width: 100%; padding-left: 0; padding-right: 0; } .mdl-dashboard-form__field--separator .mdl-dashboard-form__separator { background: 0; border: 0; border-top: 2px dashed #e6e6e6; } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-form__field { min-width: 100%; max-width: 100%; } } .mdl-dashboard-form__field + .mdl-dashboard-form__field.mdl-dashboard-transition { padding: 0; } .mdl-dashboard-form__field p { margin-bottom: 0; } .mdl-dashboard-form__field--linear { padding: 0; } .mdl-dashboard-form__field--linear .mdl-dashboard-form__label, .mdl-dashboard-form__field--linear .mdl-dashboard-form__input { display: inline-block; margin-right: 0.625rem; } .mdl-dashboard-form__field--linear .mdl-dashboard-form__label html[dir=rtl], .mdl-dashboard-form__field--linear .mdl-dashboard-form__input html[dir=rtl] { margin-right: 0; margin-left: 0.625rem; } .mdl-dashboard-form__field .mdl-dashboard-form__field { padding: 0; margin: 0 0 0.625rem 1.25rem; } .mdl-dashboard-form__field .mdl-dashboard-form__field html[dir=rtl] { margin-left: 0; margin-right: 1.25rem; } .mdl-dashboard-form__field .mdl-dashboard-form__field .mdl-dashboard-form__label:last-child { margin-bottom: 0; } .mdl-dashboard-form__field .mdl-dashboard-form__field .mdl-dashboard-form__field { border: 0; margin-left: 2.5rem; } .mdl-dashboard-form__field .mdl-dashboard-form__field .mdl-dashboard-form__field html[dir=rtl] { margin-left: 0; margin-right: 2.5rem; } .mdl-dashboard-form__scrollable-container { display: block; max-height: 200px; margin: 0.625rem; padding: 0.625rem 0 0 0; border: 1px solid #e6e6e6; overflow: auto; } .mdl-dashboard-form__scrollable-container .mdl-dashboard-form__field { padding: 0; } .mdl-dashboard-form label { cursor: pointer; } .mdl-dashboard-form__label { display: block; position: relative; padding: 0; font-size: 14px; } .mdl-dashboard-form__label:not(:empty):not(.mdl-dashboard-form__label--inline) { margin-bottom: 0.625rem; } .mdl-dashboard-form__label:empty { display: none; } .mdl-dashboard-form__label--inline, .mdl-dashboard-form__label--contain { text-transform: none; } .mdl-dashboard-form__label--inline { display: inline-block; margin: 0; margin-left: 0.625rem; } html[dir=rtl] .mdl-dashboard-form__label--inline { margin-right: 0; margin-left: 0.625rem; } .mdl-dashboard-form__label--inline .mdl-dashboard-form__input, .mdl-dashboard-form__label--inline .mdl-dashboard-form__select { display: inline-block; margin-left: 0.625rem; } html[dir=rtl] .mdl-dashboard-form__label--inline .mdl-dashboard-form__input, html[dir=rtl] .mdl-dashboard-form__label--inline .mdl-dashboard-form__select { margin-right: 0.625rem; margin-left: 0; } .mdl-dashboard-form__label--contain .mdl-dashboard-form__input, .mdl-dashboard-form__label--contain .mdl-dashboard-form__select { margin-right: 0.625rem; } html[dir=rtl] .mdl-dashboard-form__label--contain { padding-left: 0; padding-right: 2.5rem; } .mdl-dashboard-form__label-description { display: block; font-size: 12px; color: #b3b3b3; } .mdl-dashboard-form__label-inner { margin: 0 !important; border-radius: 4px; padding: 0.3125rem; font-size: 12px; line-height: 12px; } .mdl-dashboard-form--flush { align-items: center; } .mdl-dashboard-form--flush .mdl-dashboard-form__label { margin: 0; } .mdl-dashboard-form__select { -webkit-appearance: none; font-size: 12px; } .mdl-dashboard-form__input, .mdl-dashboard-form__select { display: block; max-width: 100%; padding: 0.625rem; background: hsl(0deg, 0%, 100%); border-radius: 0px; border: 1px solid #e6e6e6; line-height: 1.2rem; } .mdl-dashboard-form__input:not(.flatpickr-input)[readonly], .mdl-dashboard-form__select:not(.flatpickr-input)[readonly] { box-shadow: none; } .mdl-dashboard-form__input::-webkit-input-placeholder, .mdl-dashboard-form__input::-moz-placeholder, .mdl-dashboard-form__input:-ms-input-placeholder, .mdl-dashboard-form__select::-webkit-input-placeholder, .mdl-dashboard-form__select::-moz-placeholder, .mdl-dashboard-form__select:-ms-input-placeholder { color: #b3b3b3; } .mdl-dashboard-form__input--replaced, .mdl-dashboard-form__select--replaced { position: absolute; opacity: 0; } .mdl-dashboard-form__input:focus + .mdl-dashboard-form__faux-toggle, .mdl-dashboard-form__select:focus + .mdl-dashboard-form__faux-toggle { outline: 0; box-shadow: 0px 0px 0px 2px rgba(44, 138, 206, 0.5); } .mdl-dashboard-form__input:not(.flatpickr-input)[readonly], .mdl-dashboard-form__select:not(.flatpickr-input)[readonly] { border: 0; } .mdl-dashboard-form__select { padding-right: 1.625rem; } .mdl-dashboard-form__search { background: hsl(0deg, 0%, 100%) none no-repeat right 0.625rem center; background-image: url('data:image/svg+xml;utf8,'); background-size: 1rem; padding-right: 2rem; } html[dir=rtl] .mdl-dashboard-form__search { background-position: 6px 0.625rem; padding-right: 0.625rem; padding-left: 2rem; } .mdl-dashboard-form__faux-toggle { display: inline-block; position: absolute; top: 50%; transform: translateY(-50%); left: 0.625rem; transition: all 0.3s ease-in-out; border-radius: 2px; } html[dir=rtl] .mdl-dashboard-form__faux-toggle { left: auto; right: 0.625rem; } .mdl-dashboard-form__faux-toggle:after { content: ""; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 0; height: 0; background-size: 0; background: hsl(176deg, 42%, 54%); border: 2px solid hsl(0deg, 0%, 100%); border-radius: 3px; transition: all 0.3s ease-in-out; } .mdl-dashboard-form__faux-toggle--checked:after { width: calc(100% - 4px); height: calc(100% - 4px); } .mdl-dashboard-form__faux-toggle--radio { border-radius: 50%; } .mdl-dashboard-form__faux-toggle--radio:after { border-radius: 50%; } .mdl-dashboard-form__faux-toggle--disabled:after { background: #e6e6e6; } .mdl-dashboard-form__fieldset { padding: 0; margin: 0; border: 0; } .mdl-dashboard-form__fieldset .mdl-form__item { margin-bottom: 0; } .mdl-dashboard-form__toggle-label { display: block; position: relative; width: 80px; height: 40px; margin-bottom: 0; border: 1px solid #cccccc; border-radius: 2px; box-shadow: inset 0 1px 2px 1px rgba(230, 230, 230, 0.8); cursor: pointer; text-indent: -9999rem; transition: all 0.3s ease-in-out; } .mdl-dashboard-form__toggle-label:after { content: attr(data-label-off); display: block; position: absolute; top: 50%; transform: translateY(-50%); left: calc(80px + 0.625rem); color: #4d4d4d; text-indent: 0; } html[dir=rtl] .mdl-dashboard-form__toggle-label:after { left: auto; right: calc(80px + 0.625rem); } .mdl-dashboard-form__toggle-label:before { content: ""; display: block; position: absolute; top: 4px; left: 4px; width: 33.333%; height: calc(100% - 8px); background: #cccccc; border-radius: 1px; transition: all 0.3s ease-in-out; z-index: 1; } .mdl-dashboard-form__toggle-input { opacity: 0; height: 0; width: 0; float: right; } .mdl-dashboard-form__toggle-input:focus + label { box-shadow: 0px 0px 0px 2px rgba(44, 138, 206, 0.5); } .mdl-dashboard-form__toggle-input:checked + label:before { left: calc(100% - 4px); width: 50%; transform: translateX(-100%); background: hsl(176deg, 42%, 54%); } .mdl-dashboard-form__toggle-input:checked + label:after { content: attr(data-label-on); } .mdl-dashboard-form__button-row { display: flex; flex-wrap: wrap; justify-content: flex-end; bottom: 0; background: rgba(255, 255, 255, 0.7); margin-top: 0.625rem; padding: 0.625rem 0; z-index: 400; } .mdl-dashboard-form__button-row--sticky { position: sticky; } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-form__button-row .mdl-dashboard-button { width: 100%; flex: 0 0 100%; order: 2; } .mdl-dashboard-form__button-row .mdl-dashboard-button--primary, .mdl-dashboard-form__button-row .mdl-dashboard-button--secondary { order: 1; margin: 0 0 0.625rem; } } .mdl-dashboard-form__button-row-note { padding: 0.625rem; line-height: 1.25rem; } .mdl-dashboard-form input[type=email]:disabled, .mdl-dashboard-form input[type=password]:disabled, .mdl-dashboard-form input[type=search]:disabled, .mdl-dashboard-form input[type=tel]:disabled, .mdl-dashboard-form input[type=text]:disabled, .mdl-dashboard-form select:disabled, .mdl-dashboard-form textarea:disabled { background: #e6e6e6; border-color: #cccccc; } .mdl-dashboard-form input[type=radio], .mdl-dashboard-form input[type=checkbox] { display: inline-block; min-width: unset; } .mdl-dashboard-form select { -webkit-appearance: none; -moz-appearance: none; background: hsl(0deg, 0%, 100%) none no-repeat right 0.625rem center; background-image: url('data:image/svg+xml;utf8,'); background-size: 0.7rem; padding-right: 2rem; } html[dir=rtl] .mdl-dashboard-form select { background-position: 6px 0.625rem; } .mdl-dashboard-form textarea { width: 100%; min-height: 3.125rem; } .mdl-dashboard-form--masthead-search .mdl-dashboard-form__field { position: relative; padding: 0; background: none; } .mdl-dashboard-form--masthead-search .mdl-dashboard-form__label { display: none; } .mdl-dashboard-form--masthead-search-input { display: inline-block; min-width: 100%; padding: 0.625rem; padding-right: 2.5rem; background: #f2f2f2; color: #4d4d4d; border: 0; border-radius: 0.125rem; font-size: 14px; } .mdl-dashboard-form--masthead-search .mdl-dashboard-button { width: 3.125rem; min-width: 3.125rem; position: absolute; background: none; right: 0; } @media screen and (min-width: 0px) and (max-width: 768px) { .mdl-dashboard-form--masthead-search .mdl-dashboard-button { top: 50%; transform: translateY(-50%); } } html[dir=rtl] .mdl-dashboard-form--masthead-search .mdl-dashboard-button { right: auto; left: 0; } .mdl-dashboard-form__filter { display: flex; } .mdl-dashboard-form__filter .mdl-dashboard-form__field { flex: 1; padding: 0.625rem 0; } .mdl-dashboard-form__filter .mdl-dashboard-form__field:nth-child(n+1) { text-align: center; } .mdl-dashboard-form__filter .mdl-dashboard-form__field:last-child { text-align: right; } .mdl-dashboard-form__filter .mdl-dashboard-form__select { margin: 0 0.625rem; } .mdl-dashboard-form__fieldset { border: none; } .mdl-dashboard-form__legend { float: left; } .mdl-dashboard-masthead__subnav-search.mdl-dashboard-masthead__tools-search { margin-right: 0; } @media screen and (min-width: 769px) { .mdl-dashboard-masthead__subnav-search.mdl-dashboard-masthead__tools-search { display: none; } } .mdl-dashboard-masthead__subnav-search.mdl-dashboard-masthead__tools-search .mdl-dashboard-form { width: 100%; } .mdl-dashboard-masthead__subnav-search.mdl-dashboard-masthead__tools-search .mdl-dashboard-form__input { width: 100%; background: hsl(0deg, 0%, 100%); } .mdl-dashboard-geo__margin--narrow > * { margin: 0.15625rem; } .mdl-dashboard-geo__margin--x-narrow > * { margin: 0 0.15625rem; } .mdl-dashboard-geo__margin--y-narrow > * { margin: 0.15625rem 0; } .mdl-dashboard-geo__padding--narrow > * { padding: 0.15625rem; } .mdl-dashboard-geo__padding--x-narrow > * { padding: 0 0.15625rem; } .mdl-dashboard-geo__padding--y-narrow > * { padding: 0.15625rem 0; } .mdl-dashboard-geo__margin--compact > * { margin: 0.3125rem; } .mdl-dashboard-geo__margin--x-compact > * { margin: 0 0.3125rem; } .mdl-dashboard-geo__margin--y-compact > * { margin: 0.3125rem 0; } .mdl-dashboard-geo__padding--compact > * { padding: 0.3125rem; } .mdl-dashboard-geo__padding--x-compact > * { padding: 0 0.3125rem; } .mdl-dashboard-geo__padding--y-compact > * { padding: 0.3125rem 0; } .mdl-dashboard-geo__margin--normal > * { margin: 0.625rem; } .mdl-dashboard-geo__margin--x-normal > * { margin: 0 0.625rem; } .mdl-dashboard-geo__margin--y-normal > * { margin: 0.625rem 0; } .mdl-dashboard-geo__padding--normal > * { padding: 0.625rem; } .mdl-dashboard-geo__padding--x-normal > * { padding: 0 0.625rem; } .mdl-dashboard-geo__padding--y-normal > * { padding: 0.625rem 0; } .mdl-dashboard-geo__margin--comfortable > * { margin: 1.25rem; } .mdl-dashboard-geo__margin--x-comfortable > * { margin: 0 1.25rem; } .mdl-dashboard-geo__margin--y-comfortable > * { margin: 1.25rem 0; } .mdl-dashboard-geo__padding--comfortable > * { padding: 1.25rem; } .mdl-dashboard-geo__padding--x-comfortable > * { padding: 0 1.25rem; } .mdl-dashboard-geo__padding--y-comfortable > * { padding: 1.25rem 0; } .mdl-dashboard-geo__margin--loose > * { margin: 2.5rem; } .mdl-dashboard-geo__margin--x-loose > * { margin: 0 2.5rem; } .mdl-dashboard-geo__margin--y-loose > * { margin: 2.5rem 0; } .mdl-dashboard-geo__padding--loose > * { padding: 2.5rem; } .mdl-dashboard-geo__padding--x-loose > * { padding: 0 2.5rem; } .mdl-dashboard-geo__padding--y-loose > * { padding: 2.5rem 0; } .mdl-dashboard-hero { position: relative; padding: 1.25rem; text-align: center; background-color: #FFF; } .mdl-dashboard-hero--solid, .mdl-dashboard-hero--has-background { position: relative; background: transparent none no-repeat center top; background-size: cover; } @media screen and (min-width: 577px) { .mdl-dashboard-hero--solid, .mdl-dashboard-hero--has-background { min-height: 100px; } } @media screen and (min-width: 769px) { .mdl-dashboard-hero--solid, .mdl-dashboard-hero--has-background { min-height: 150px; } } .mdl-dashboard-hero--solid:after, .mdl-dashboard-hero--has-background:after { content: ""; position: absolute; left: 0; top: 0; width: 100%; z-index: -1; min-height: 500px; background: transparent none no-repeat center top; background-image: inherit; background-size: 100%; } .mdl-dashboard-hero--solid .mdl-dashboard-hero__title, .mdl-dashboard-hero--has-background .mdl-dashboard-hero__title { display: inline-block; position: relative; width: 100%; padding: 30px 0; margin: 45px 0; font-size: 3.125rem; text-align: center; z-index: 100; } .mdl-dashboard-hero--solid { background-color: hsl(205deg, 65%, 49%); } .mdl-dashboard-hero--solid:after { min-height: 24.5625rem; background-color: hsl(205deg, 65%, 49%); } .mdl-dashboard-hero--solid .mdl-dashboard-hero__navigation { background: none; } .mdl-dashboard-hero__image { vertical-align: middle; } .mdl-dashboard-hero__title { color: #1B2437; margin: 0; font-size: 2.85714rem; line-height: 3.75rem; font-weight: 400; } .mdl-dashboard-loading { display: block; width: 64px; height: 64px; } .mdl-dashboard-loading:after { content: " "; display: block; width: 46px; height: 46px; margin: 1px; border-radius: 50%; border: 5px solid #a0a0a0; border-color: #a0a0a0 transparent #a0a0a0 transparent; animation: mdl-dashboard-loading 1.2s linear infinite; } .mdl-dashboard-loading_idea-count:after { width: 20px; height: 20px; border-width: 3px; } @keyframes mdl-dashboard-loading { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .mdl-dashboard-modal-overlay { display: flex; align-items: center; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 800; } .mdl-dashboard-modal { position: relative; top: 10%; width: 100%; max-width: 400px; padding: 0; margin: auto; background: hsl(0deg, 0%, 100%); z-index: 600; box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } @media screen and (min-width: 577px) { .mdl-dashboard-modal { position: relative; height: auto; width: auto; min-width: 25rem; } } .mdl-dashboard-modal * { box-sizing: border-box; } .mdl-dashboard-modal--grey { background: #f2f2f2; } .mdl-dashboard-modal--padded { padding: 1.25rem; } .mdl-dashboard-modal--frameless { width: 1024px; min-width: 1024px; height: 600px; height: 80vh; } .mdl-dashboard-modal__close { margin-left: auto; } .mdl-dashboard-modal-container { padding: 1.25rem; } .mdl-dashboard-modal-container__header { display: flex; max-width: 100%; margin-bottom: 1.25rem; } .mdl-dashboard-modal-container__title { width: auto; white-space: nowrap; } .mdl-dashboard-modal-container__description { margin-left: 1.25rem; } html[dir=rtl] .mdl-dashboard-modal-container__description { margin-right: 1.25rem; margin-left: 0; } .mdl-dashboard-modal-page__title { font-family: "Source Sans Pro", "Helvetica Neue", Arial, Helvetica, sans-serif; font-size: 18px; } .mdl-dashboard-modal-page__nav { display: flex; align-items: center; padding: 0.625rem; margin: -0.625rem; margin-bottom: 0.625rem; } .mdl-dashboard-modal-page__header { padding: 24px 24px 0; } .mdl-dashboard-modal-page__header h3 { margin: 0; padding: 0; } .mdl-dashboard-modal-page__body { padding: 0 24px 24px; } .mdl-dashboard-modal--move { min-height: 300px; min-width: 400px; width: 940px; max-width: 940px; } .cwd-admin-modal-wrapper { padding: 1.25rem; } .mdl-dashboard-wrapper { padding: 1.25rem; } @media screen and (min-width: 993px) { .mdl-dashboard-wrapper--sticky { position: sticky; top: 0.625rem; } } @media screen and (min-width: 0px) and (max-width: 576px) { .mdl-dashboard-wrapper--flush { padding: 1.25rem 0; } } .mdl-dashboard-wrapper--rounded { border-radius: 0px; background: hsl(0deg, 0%, 100%); box-shadow: 0 0 20px rgba(26, 26, 26, 0.25); } .mdl-dashboard-wrapper--body h1:not(:only-of-type), .mdl-dashboard-wrapper--body h2:not(:only-of-type), .mdl-dashboard-wrapper--body h3, .mdl-dashboard-wrapper--body h4, .mdl-dashboard-wrapper--body h5, .mdl-dashboard-wrapper--body h6 { margin: 1.25rem 0; } .mdl-dashboard-wrapper--body .mdl-dashboard-card header h2 { font-size: 2.8rem; } .mdl-dashboard-wrapper__content { margin: 0.625rem 0; font-size: 12px; } .mdl-dashboard-wrapper__header { margin-bottom: 0.625rem; } @media print { body { font-family: "Source Sans Pro", "Helvetica Neue", Arial, Helvetica, sans-serif; } .b-header, #footer { display: none; } .mdl-app-dashboard__print .mdl-dashboard-filter__filters-wrapper { display: none; } .mdl-app-dashboard__print .mdl-dashboard-card-container { display: block; } .mdl-app-dashboard__print .mdl-dashboard-card-container .mdl-dashboard-card { display: block; page-break-inside: avoid; } .mdl-app-dashboard__print .mdl-dashboard-card-container .mdl-dashboard-card .mdl-dashboard-dropdown { display: none; } .mdl-app-dashboard__print .mdl-dashboard-card-container--grid .mdl-dashboard-card { float: left; max-width: calc(33.33% - 1rem); margin: 0.5rem; } .mdl-app-dashboard__print .mdl-dashboard-card-container--grid .mdl-dashboard-card:nth-child(3n+1) { clear: left; } .mdl-app-dashboard__print--pages .mdl-dashboard-card { width: 100% !important; max-width: 100% !important; flex-flow: row; float: none !important; page-break-before: always; } }