@aurodesignsystem/auro-header/src/style-css.js

auro-header HTML custom element

import {css} from 'lit';
export default css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.heading{margin:1.75rem 0;letter-spacing:var(--ds-text-heading-default-spacing, -0.2px);font-weight:var(--ds-text-heading-default-weight, 500)}.heading--display{margin-top:0;font-size:var(--ds-text-heading-display-size-breakpoint-sm, 2.75rem);font-weight:var(--ds-text-heading-display-weight, 100);line-height:var(--ds-text-heading-display-height-breakpoint-sm, 3.375rem)}@media screen and (min-width: 768px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-md, 3rem);line-height:var(--ds-text-heading-display-height-breakpoint-md, 3.75rem)}}@media screen and (min-width: 1024px){.heading--display{font-size:var(--ds-text-heading-display-size-breakpoint-lg, 3.5rem);line-height:var(--ds-text-heading-display-height-breakpoint-lg, 4.25rem)}}.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-sm, 2rem);font-weight:var(--ds-text-heading-800-weight, 500);line-height:var(--ds-text-heading-800-height-breakpoint-sm, 2.375rem)}@media screen and (min-width: 768px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-md, 2.25rem);line-height:var(--ds-text-heading-800-height-breakpoint-md, 2.625rem)}}@media screen and (min-width: 1024px){.heading--800{font-size:var(--ds-text-heading-800-size-breakpoint-lg, 2.5rem);line-height:var(--ds-text-heading-800-height-breakpoint-lg, 3rem)}}.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-sm, 1.75rem);font-weight:var(--ds-text-heading-700-weight, 500);line-height:var(--ds-text-heading-700-height-breakpoint-sm, 2.125rem)}@media screen and (min-width: 768px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-md, 2rem);line-height:var(--ds-text-heading-700-height-breakpoint-md, 2.375rem)}}@media screen and (min-width: 1024px){.heading--700{font-size:var(--ds-text-heading-700-size-breakpoint-lg, 2.25rem);line-height:var(--ds-text-heading-700-height-breakpoint-lg, 2.75rem)}}.heading--600{margin:1rem 0;font-size:var(--ds-text-heading-600-size-breakpoint-sm, 1.625rem);font-weight:var(--ds-text-heading-600-weight, 300);line-height:var(--ds-text-heading-600-height-breakpoint-sm, 1.875rem)}@media screen and (min-width: 768px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-md, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-md, 2.125rem)}}@media screen and (min-width: 1024px){.heading--600{font-size:var(--ds-text-heading-600-size-breakpoint-lg, 1.75rem);line-height:var(--ds-text-heading-600-height-breakpoint-lg, 2.25rem)}}.heading--500{margin:1rem 0;font-size:var(--ds-text-heading-500-size-breakpoint-sm, 1.375rem);font-weight:var(--ds-text-heading-500-weight, 300);line-height:var(--ds-text-heading-500-height-breakpoint-sm, 1.625rem)}@media screen and (min-width: 768px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-md, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-md, 1.875rem)}}@media screen and (min-width: 1024px){.heading--500{font-size:var(--ds-text-heading-500-size-breakpoint-lg, 1.5rem);line-height:var(--ds-text-heading-500-height-breakpoint-lg, 2rem)}}.heading--400{margin:.75rem 0;font-size:var(--ds-text-heading-400-size, 1.25rem);font-weight:var(--ds-text-heading-400-weight, 300);line-height:var(--ds-text-heading-400-height, 1.625rem)}.heading--300{margin:.75rem 0;font-size:var(--ds-text-heading-300-size, 1.125rem);font-weight:var(--ds-text-heading-300-weight, 300);line-height:var(--ds-text-heading-300-height, 1.625rem)}.util_inlinePaddingNone--left{padding-left:0}.util_inlinePaddingNone--right{padding-right:0}.util_inlineMarginNone--left{margin-left:0}.util_inlineMarginNone--right{margin-right:0}.util_inlinePadding25--left{padding-left:.125rem}.util_inlinePadding25--right{padding-right:.125rem}.util_inlineMargin25--left{margin-left:.125rem}.util_inlineMargin25--right{margin-right:.125rem}.util_inlinePadding50--left{padding-left:.25rem}.util_inlinePadding50--right{padding-right:.25rem}.util_inlineMargin50--left{margin-left:.25rem}.util_inlineMargin50--right{margin-right:.25rem}.util_inlinePadding100--left{padding-left:.5rem}.util_inlinePadding100--right{padding-right:.5rem}.util_inlineMargin100--left{margin-left:.5rem}.util_inlineMargin100--right{margin-right:.5rem}.util_inlinePadding200--left{padding-left:1rem}.util_inlinePadding200--right{padding-right:1rem}.util_inlineMargin200--left{margin-left:1rem}.util_inlineMargin200--right{margin-right:1rem}.util_inlinePadding300--left{padding-left:1.5rem}.util_inlinePadding300--right{padding-right:1.5rem}.util_inlineMargin300--left{margin-left:1.5rem}.util_inlineMargin300--right{margin-right:1.5rem}.util_inlinePadding400--left{padding-left:2rem}.util_inlinePadding400--right{padding-right:2rem}.util_inlineMargin400--left{margin-left:2rem}.util_inlineMargin400--right{margin-right:2rem}.util_inlinePadding500--left{padding-left:2.5rem}.util_inlinePadding500--right{padding-right:2.5rem}.util_inlineMargin500--left{margin-left:2.5rem}.util_inlineMargin500--right{margin-right:2.5rem}.util_inlinePadding600--left{padding-left:3rem}.util_inlinePadding600--right{padding-right:3rem}.util_inlineMargin600--left{margin-left:3rem}.util_inlineMargin600--right{margin-right:3rem}.util_inlinePadding700--left{padding-left:3.5rem}.util_inlinePadding700--right{padding-right:3.5rem}.util_inlineMargin700--left{margin-left:3.5rem}.util_inlineMargin700--right{margin-right:3.5rem}.util_inlinePadding800--left{padding-left:4rem}.util_inlinePadding800--right{padding-right:4rem}.util_inlineMargin800--left{margin-left:4rem}.util_inlineMargin800--right{margin-right:4rem}.util_inlinePadding900--left{padding-left:4.5rem}.util_inlinePadding900--right{padding-right:4.5rem}.util_inlineMargin900--left{margin-left:4.5rem}.util_inlineMargin900--right{margin-right:4.5rem}.util_inlinePadding1000--left{padding-left:5rem}.util_inlinePadding1000--right{padding-right:5rem}.util_inlineMargin1000--left{margin-left:5rem}.util_inlineMargin1000--right{margin-right:5rem}.util_stackPaddingNone--top{padding-top:0}.util_stackPaddingNone--bottom{padding-bottom:0}.util_stackMarginNone--top{margin-top:0}.util_stackMarginNone--bottom{margin-bottom:0}.util_stackPadding25--top{padding-top:.125rem}.util_stackPadding25--bottom{padding-bottom:.125rem}.util_stackMargin25--top{margin-top:.125rem}.util_stackMargin25--bottom{margin-bottom:.125rem}.util_stackPadding50--top{padding-top:.25rem}.util_stackPadding50--bottom{padding-bottom:.25rem}.util_stackMargin50--top{margin-top:.25rem}.util_stackMargin50--bottom{margin-bottom:.25rem}.util_stackPadding100--top{padding-top:.5rem}.util_stackPadding100--bottom{padding-bottom:.5rem}.util_stackMargin100--top{margin-top:.5rem}.util_stackMargin100--bottom{margin-bottom:.5rem}.util_stackPadding200--top{padding-top:1rem}.util_stackPadding200--bottom{padding-bottom:1rem}.util_stackMargin200--top{margin-top:1rem}.util_stackMargin200--bottom{margin-bottom:1rem}.util_stackPadding300--top{padding-top:1.5rem}.util_stackPadding300--bottom{padding-bottom:1.5rem}.util_stackMargin300--top{margin-top:1.5rem}.util_stackMargin300--bottom{margin-bottom:1.5rem}.util_stackPadding400--top{padding-top:2rem}.util_stackPadding400--bottom{padding-bottom:2rem}.util_stackMargin400--top{margin-top:2rem}.util_stackMargin400--bottom{margin-bottom:2rem}.util_stackPadding500--top{padding-top:2.5rem}.util_stackPadding500--bottom{padding-bottom:2.5rem}.util_stackMargin500--top{margin-top:2.5rem}.util_stackMargin500--bottom{margin-bottom:2.5rem}.util_stackPadding600--top{padding-top:3rem}.util_stackPadding600--bottom{padding-bottom:3rem}.util_stackMargin600--top{margin-top:3rem}.util_stackMargin600--bottom{margin-bottom:3rem}.util_stackPadding700--top{padding-top:3.5rem}.util_stackPadding700--bottom{padding-bottom:3.5rem}.util_stackMargin700--top{margin-top:3.5rem}.util_stackMargin700--bottom{margin-bottom:3.5rem}.util_stackPadding800--top{padding-top:4rem}.util_stackPadding800--bottom{padding-bottom:4rem}.util_stackMargin800--top{margin-top:4rem}.util_stackMargin800--bottom{margin-bottom:4rem}.util_stackPadding900--top{padding-top:4.5rem}.util_stackPadding900--bottom{padding-bottom:4.5rem}.util_stackMargin900--top{margin-top:4.5rem}.util_stackMargin900--bottom{margin-bottom:4.5rem}.util_stackPadding1000--top{padding-top:5rem}.util_stackPadding1000--bottom{padding-bottom:5rem}.util_stackMargin1000--top{margin-top:5rem}.util_stackMargin1000--bottom{margin-bottom:5rem}:host([type=px]) .heading--display{font-size:var(--ds-text-heading-display-px-breakpoint-sm, 44px);line-height:var(--ds-text-heading-display-height-breakpoint-px-sm, 54px)}@media screen and (min-width: 768px){:host([type=px]) .heading--display{font-size:var(--ds-text-heading-display-px-breakpoint-md, 48px);line-height:var(--ds-text-heading-display-height-breakpoint-px-sm, 54px)}}@media screen and (min-width: 1024px){:host([type=px]) .heading--display{font-size:var(--ds-text-heading-display-px-breakpoint-lg, 56px);line-height:var(--ds-text-heading-display-height-breakpoint-px-lg, 68px)}}:host([type=px]) .heading--800{font-size:var(--ds-text-heading-800-px-breakpoint-sm, 32px);line-height:var(--ds-text-heading-800-height-breakpoint-px-sm, 38px)}@media screen and (min-width: 768px){:host([type=px]) .heading--800{font-size:var(--ds-text-heading-800-px-breakpoint-md, 36px);line-height:var(--ds-text-heading-800-height-breakpoint-px-md, 42px)}}@media screen and (min-width: 1024px){:host([type=px]) .heading--800{font-size:var(--ds-text-heading-800-px-breakpoint-lg, 40px);line-height:var(--ds-text-heading-800-height-breakpoint-px-lg, 48px)}}:host([type=px]) .heading--700{font-size:var(--ds-text-heading-700-px-breakpoint-sm, 28px);line-height:var(--ds-text-heading-700-height-breakpoint-px-sm, 34px)}@media screen and (min-width: 768px){:host([type=px]) .heading--700{font-size:var(--ds-text-heading-700-px-breakpoint-md, 32px);line-height:var(--ds-text-heading-700-height-breakpoint-px-md, 38px)}}@media screen and (min-width: 1024px){:host([type=px]) .heading--700{font-size:var(--ds-text-heading-700-px-breakpoint-lg, 36px);line-height:var(--ds-text-heading-700-height-breakpoint-px-lg, 44px)}}:host([type=px]) .heading--600{font-size:var(--ds-text-heading-600-px-breakpoint-sm, 26px);line-height:var(--ds-text-heading-600-height-breakpoint-px-sm, 30px);margin:var(--ds-size-200) 0}@media screen and (min-width: 768px){:host([type=px]) .heading--600{font-size:var(--ds-text-heading-600-px-breakpoint-md, 28px);line-height:var(--ds-text-heading-600-height-breakpoint-px-md, 34px)}}@media screen and (min-width: 1024px){:host([type=px]) .heading--600{line-height:var(--ds-text-heading-600-height-breakpoint-px-lg, 36px)}}:host([type=px]) .heading--500{font-size:var(--ds-text-heading-500-px-breakpoint-sm, 22px);line-height:var(--ds-text-heading-500-height-breakpoint-px-sm, 26px);margin:16px 0}@media screen and (min-width: 768px){:host([type=px]) .heading--500{font-size:var(--ds-text-heading-500-px-breakpoint-md, 24px);line-height:var(--ds-text-heading-500-height-breakpoint-px-md, 30px)}}@media screen and (min-width: 1024px){:host([type=px]) .heading--500{line-height:var(--ds-text-heading-500-height-breakpoint-px-lg, 32px)}}:host([type=px]) .heading--400{font-size:var(--ds-text-heading-400-px, 20px);line-height:var(--ds-text-heading-400-height-px, 26px);margin:var(--ds-size-150) 0}:host([type=px]) .heading--300{font-size:var(--ds-text-heading-300-px, 18px);line-height:var(--ds-text-heading-300-height-px, 26px);margin:var(--ds-size-150) 0}:host([type=px]) .util_stackMarginnone--bottom{margin-bottom:0}:host([type=px]) .util_stackMargin25--bottom{margin-bottom:var(--ds-size-25, 0.125rem)}:host([type=px]) .util_stackMargin50--bottom{margin-bottom:var(--ds-size-50, 0.25rem)}:host([type=px]) .util_stackMargin100--bottom{margin-bottom:var(--ds-size-100, 0.5rem)}:host([type=px]) .util_stackMargin150--bottom{margin-bottom:var(--ds-size-150, 0.75rem)}:host([type=px]) .util_stackMargin200--bottom{margin-bottom:var(--ds-size-200, 1rem)}:host([type=px]) .util_stackMargin300--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}:host([type=px]) .util_stackMargin400--bottom{margin-bottom:var(--ds-size-400, 2rem)}:host([type=px]) .util_stackMargin600--bottom{margin-bottom:var(--ds-size-600, 3rem)}:host([type=px]) .util_stackMargin800--bottom{margin-bottom:var(--ds-size-800, 4rem)}:host([type=px]) .util_stackMarginXxxs--bottom{margin-bottom:var(--ds-size-25, 0.125rem)}:host([type=px]) .util_stackMarginXxs--bottom{margin-bottom:var(--ds-size-50, 0.25rem)}:host([type=px]) .util_stackMarginXs--bottom{margin-bottom:var(--ds-size-100, 0.5rem)}:host([type=px]) .util_stackMarginSm--bottom{margin-bottom:var(--ds-size-150, 0.75rem)}:host([type=px]) .util_stackMarginMd--bottom{margin-bottom:var(--ds-size-200, 1rem)}:host([type=px]) .util_stackMarginLg--bottom{margin-bottom:var(--ds-size-300, 1.5rem)}:host([type=px]) .util_stackMarginXl--bottom{margin-bottom:var(--ds-size-400, 2rem)}:host([type=px]) .util_stackMarginXxl--bottom{margin-bottom:var(--ds-size-600, 3rem)}:host([type=px]) .util_stackMarginXxxl--bottom{margin-bottom:var(--ds-size-800, 4rem)}:host([type=px]) .util_stackMarginnone--top{margin-bottom:0}:host([type=px]) .util_stackMargin25--top{margin-bottom:var(--ds-size-25, 0.125rem)}:host([type=px]) .util_stackMargin50--top{margin-bottom:var(--ds-size-50, 0.25rem)}:host([type=px]) .util_stackMargin100--top{margin-bottom:var(--ds-size-100, 0.5rem)}:host([type=px]) .util_stackMargin150--top{margin-bottom:var(--ds-size-150, 0.75rem)}:host([type=px]) .util_stackMargin200--top{margin-bottom:var(--ds-size-200, 1rem)}:host([type=px]) .util_stackMargin300--top{margin-bottom:var(--ds-size-300, 1.5rem)}:host([type=px]) .util_stackMargin400--top{margin-bottom:var(--ds-size-400, 2rem)}:host([type=px]) .util_stackMargin600--top{margin-bottom:var(--ds-size-600, 3rem)}:host([type=px]) .util_stackMargin800--top{margin-bottom:var(--ds-size-800, 4rem)}:host([type=px]) .util_stackMarginXxxs--top{margin-bottom:var(--ds-size-25, 0.125rem)}:host([type=px]) .util_stackMarginXxs--top{margin-bottom:var(--ds-size-50, 0.25rem)}:host([type=px]) .util_stackMarginXs--top{margin-bottom:var(--ds-size-100, 0.5rem)}:host([type=px]) .util_stackMarginSm--top{margin-bottom:var(--ds-size-150, 0.75rem)}:host([type=px]) .util_stackMarginMd--top{margin-bottom:var(--ds-size-200, 1rem)}:host([type=px]) .util_stackMarginLg--top{margin-bottom:var(--ds-size-300, 1.5rem)}:host([type=px]) .util_stackMarginXl--top{margin-bottom:var(--ds-size-400, 2rem)}:host([type=px]) .util_stackMarginXxl--top{margin-bottom:var(--ds-size-600, 3rem)}:host([type=px]) .util_stackMarginXxxl--top{margin-bottom:var(--ds-size-800, 4rem)}`;