@pisell/layout
Version:
基于 Fusion 设计系统的自然布局体系
1 lines • 39.2 kB
CSS
.fd-layout-bg--lining{background:var(--color-lining)}.fd-layout-bg--surface{background:var(--color-surface)}.fd-layout-bg--transparent{background:var(--color-transparent)}.fd-layout-page{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.fd-layout-page,.fd-layout-page-min-height-helper{-webkit-box-sizing:border-box;box-sizing:border-box;margin:0 auto}.fd-layout-page-min-height-helper{width:100%}.fd-layout-page-content--center-mode{padding-left:var(--page-padding-lr);padding-right:var(--page-padding-lr)}.fd-layout-page-content--center-mode .fd-layout-page-content{max-width:var(--page-max-content-width)}.fd-layout-page-content{display:grid;margin:0 auto;grid-gap:var(--page-section-gap);gap:var(--page-section-gap);width:100%}.fd-layout-page-content.fd-layout-page-content-no-padding{padding:0}.fd-layout-page-content .fd-layout-page-main{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:stretch;-webkit-justify-content:stretch;-ms-flex-pack:stretch;justify-content:stretch;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;grid-gap:var(--page-section-gap);gap:var(--page-section-gap);-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.fd-layout-page-content .fd-layout-page-main>*{width:100%}.fd-layout-page-content .fd-layout-page-nav-inner{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;grid-gap:var(--page-block-gap);gap:var(--page-block-gap)}.fd-layout-page-content .fd-layout-page-nav-inner>*{max-width:100%}.fd-layout-page-content .fd-layout-page-aside-inner{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;grid-gap:var(--page-block-gap);gap:var(--page-block-gap)}.fd-layout-page-content .fd-layout-page-aside-inner>*{max-width:100%}.fd-layout-page--not-tab.fd-layout-page--headless .fd-layout-page-content{padding-top:0}.fd-layout-page--not-tab.fd-layout-page--footless .fd-layout-page-content{padding-bottom:0}.fd-layout-page--not-tab.fd-layout-page--footless .fd-layout-page-main>:last-child{padding-bottom:var(--page-padding-tb)}.fd-layout-page-content--single-col{padding-left:0;padding-right:0}.fd-layout-page--not-tab .fd-layout-page-min-height-helper{-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1}.fd-layout-page--not-tab .fd-layout-page-min-height-helper:first-child .fd-layout-page-main>:first-child{padding-top:var(--page-padding-tb)}.fd-layout-page--not-tab .fd-layout-page-min-height-helper:first-child .fd-layout-page-main>:last-child{padding-bottom:var(-page-padding-tb)}.fd-layout-page--not-tab .fd-layout-page-min-height-helper .fd-layout-page-aside,.fd-layout-page--not-tab .fd-layout-page-min-height-helper .fd-layout-page-nav{padding-top:0;padding-bottom:0}.fd-layout-page--headless.fd-layout-page--not-tab .fd-layout-page-content .fd-layout-page-aside,.fd-layout-page--headless.fd-layout-page--not-tab .fd-layout-page-content .fd-layout-page-main>:first-child,.fd-layout-page--headless.fd-layout-page--not-tab .fd-layout-page-content .fd-layout-page-nav{padding-top:var(--page-padding-tb)}.fd-layout-page--footless .fd-layout-page-content .fd-layout-page-aside,.fd-layout-page--footless .fd-layout-page-content .fd-layout-page-main>:last-child,.fd-layout-page--footless .fd-layout-page-content .fd-layout-page-nav{padding-bottom:var(--page-padding-tb)}.fd-layout-page--no-padding .fd-layout-header,.fd-layout-page--no-padding .fd-layout-page-aside,.fd-layout-page--no-padding .fd-layout-page-nav{padding-top:0}.fd-layout-page--no-padding .fd-layout-footer,.fd-layout-page--no-padding .fd-layout-page-aside,.fd-layout-page--no-padding .fd-layout-page-nav{padding-bottom:0}.fd-layout-page--no-padding.fd-layout-page--headless .fd-layout-page-main>:first-child{padding-top:0}.fd-layout-page--no-padding.fd-layout-page--footless .fd-layout-page-main>:last-child{padding-bottom:0}.fd-layout-page--no-padding .fd-layout-page-content--center-mode{padding-left:0;padding-right:0}.fd-layout-page-header{margin-bottom:var(--page-section-gap);padding:var(--page-padding-tb) var(--page-header-padding-lr) var(--page-block-padding-tb)}.fd-layout-page-header--no-bottom-padding{padding-bottom:0}.fd-layout-page-header--dividing{border-bottom:var(--line-1) solid var(--page-header-divider-color)}.fd-layout-page-header--no-margin{margin-bottom:0}.fd-layout-page-header--fixed{position:fixed;width:100%;left:0;top:0;z-index:var(--elevation-4)}.fd-layout-page-footer{margin-top:var(--page-section-gap);-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding:var(--page-block-padding-tb) var(--page-footer-padding-lr) var(--page-padding-tb)}.fd-layout-page-footer--dividing{border-top:var(--line-1) solid var(--page-header-divider-color)}.fd-layout-page-footer--fixed{position:fixed;width:100%;left:0;bottom:0;z-index:var(--elevation-4)}.fd-layout-page-footer,.fd-layout-page-header{-webkit-box-sizing:border-box;box-sizing:border-box}.fd-layout-page-footer--no-top-padding,.fd-layout-page-header--no-top-padding{padding-top:0}.fd-layout-page-footer-inner,.fd-layout-page-header-inner{-webkit-box-sizing:border-box;box-sizing:border-box;margin-left:auto;margin-right:auto;max-width:var(--page-max-content-width)}.fd-layout-page-footer--fullwidth .fd-layout-page-footer-inner,.fd-layout-page-header--fullwidth .fd-layout-page-header-inner{max-width:none}.fd-layout-page--no-padding .fd-layout-page-header{padding-top:0;padding-left:0;padding-right:0}.fd-layout-page--no-padding .fd-layout-page-footer{padding-bottom:0;padding-left:0;padding-right:0}.fd-layout-cell-align--left .fd-layout-p{-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.fd-layout-cell-align--center .fd-layout-p{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.fd-layout-cell-align--right .fd-layout-p{-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.fd-layout-cell-align--space-evenly .fd-layout-p{-webkit-box-pack:space-evenly;-webkit-justify-content:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly}.fd-layout-cell-align--space-between .fd-layout-p{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.fd-layout-cell-align--space-around .fd-layout-p{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.fd-layout-cell-align--center .fd-layout-p-spacing--small>*,.fd-layout-cell-align--left .fd-layout-p-spacing--small>*,.fd-layout-cell-align--middle .fd-layout-p-spacing--small>*{margin-right:var(--page-p-small-spacing)}.fd-layout-cell-align--center .fd-layout-p-spacing--medium>*,.fd-layout-cell-align--left .fd-layout-p-spacing--medium>*,.fd-layout-cell-align--middle .fd-layout-p-spacing--medium>*{margin-right:var(--page-p-medium-spacing)}.fd-layout-cell-align--center .fd-layout-p-spacing--large>*,.fd-layout-cell-align--left .fd-layout-p-spacing--large>*,.fd-layout-cell-align--middle .fd-layout-p-spacing--large>*{margin-right:var(--page-p-large-spacing)}.fd-layout-cell-align--space-around .fd-layout-p-spacing>*,.fd-layout-cell-align--space-around .fd-layout-p-spacing>text,.fd-layout-cell-align--space-between .fd-layout-p-spacing>*,.fd-layout-cell-align--space-between .fd-layout-p-spacing>text,.fd-layout-cell-align--space-evenly .fd-layout-p-spacing>*,.fd-layout-cell-align--space-evenly .fd-layout-p-spacing>text,.fd-layout-cell-align--stretch .fd-layout-p-spacing>*,.fd-layout-cell-align--stretch .fd-layout-p-spacing>text{margin-left:0;margin-right:0}.fd-layout-cell-align--center .fd-layout-p-spacing>:last-child,.fd-layout-cell-align--left .fd-layout-p-spacing>:last-child,.fd-layout-cell-align--middle .fd-layout-p-spacing>:last-child{margin-right:0}.fd-layout-cell-align--right .fd-layout-p-spacing--small>*{margin-left:var(--page-p-small-spacing)}.fd-layout-cell-align--right .fd-layout-p-spacing--medium>*{margin-left:var(--page-p-medium-spacing)}.fd-layout-cell-align--right .fd-layout-p-spacing--large>*{margin-left:var(--page-p-large-spacing)}.fd-layout-cell-align--right .fd-layout-p-spacing>*{margin-right:0}.fd-layout-cell-align--right .fd-layout-p-spacing>:first-child{margin-left:0}.fd-layout-p{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;color:var(--page-p-font-color);width:100%}.fd-layout-p-text{font-size:var(--p-body-1-font-size);font-weight:var(--p-body-1-font-weight);line-height:var(--p-body-1-line-height)}.fd-layout-p--h1{font-size:var(--p-h1-font-size);font-weight:var(--p-h1-font-weight);line-height:var(--p-h1-line-height)}.fd-layout-p--h2{font-size:var(--p-h2-font-size);font-weight:var(--p-h2-font-weight);line-height:var(--p-h2-line-height)}.fd-layout-p--h3{font-size:var(--p-h3-font-size);font-weight:var(--p-h3-font-weight);line-height:var(--p-h3-line-height)}.fd-layout-p--h4{font-size:var(--p-h4-font-size);font-weight:var(--p-h4-font-weight);line-height:var(--p-h4-line-height)}.fd-layout-p--h5{font-size:var(--p-h5-font-size);font-weight:var(--p-h5-font-weight);line-height:var(--p-h5-line-height)}.fd-layout-p--h6{font-size:var(--p-h6-font-size);font-weight:var(--p-h6-font-weight);line-height:var(--p-h6-line-height)}.fd-layout-p--body1{font-size:var(--p-body1-font-size);font-weight:var(--p-body1-font-weight);line-height:var(--p-body1-line-height)}.fd-layout-p--body2{font-size:var(--p-body2-font-size);font-weight:var(--p-body2-font-weight);line-height:var(--p-body2-line-height)}.fd-layout-p--caption{font-size:var(--p-caption-font-size);font-weight:var(--p-caption-font-weight);line-height:var(--p-caption-line-height)}.fd-layout-p--overline{font-size:var(--p-overline-font-size);font-weight:var(--p-overline-font-weight);line-height:var(--p-overline-line-height)}.fd-layout-p-before-padding--small{margin-top:var(--page-p-padding-small-size)}.fd-layout-p-before-padding--small:first-child{margin-top:0}.fd-layout-p-after-padding--small{margin-bottom:var(--page-p-padding-small-size)}.fd-layout-p-after-padding--small:last-child{margin-bottom:0}.fd-layout-p-before-padding--medium{margin-top:var(--page-p-padding-medium-size)}.fd-layout-p-before-padding--medium:first-child{margin-top:0}.fd-layout-p-after-padding--medium{margin-bottom:var(--page-p-padding-medium-size)}.fd-layout-p-after-padding--medium:last-child{margin-bottom:0}.fd-layout-p-before-padding--large{margin-top:var(--page-p-padding-large-size)}.fd-layout-p-before-padding--large:first-child{margin-top:0}.fd-layout-p-after-padding--large{margin-bottom:var(--page-p-padding-large-size)}.fd-layout-p-after-padding--large:last-child{margin-bottom:0}.fd-layout-p-margin>*,.fd-layout-p-margin>.fd-layout-text,.fd-layout-p-margin>text{margin-top:0;margin-bottom:0}.fd-layout-p-spacing--small.fd-layout-p-spacing--center>*,.fd-layout-p-spacing--small.fd-layout-p-spacing--left>*,.fd-layout-p-spacing--small.fd-layout-p-spacing--middle>*,.fd-layout-p-spacing--small>*{margin-right:var(--page-p-small-spacing)}.fd-layout-p-spacing--small.fd-layout-p-spacing--right>*{margin-left:var(--page-p-small-spacing)}.fd-layout-p-spacing--medium.fd-layout-p-spacing--center>*,.fd-layout-p-spacing--medium.fd-layout-p-spacing--left>*,.fd-layout-p-spacing--medium.fd-layout-p-spacing--middle>*,.fd-layout-p-spacing--medium>*{margin-right:var(--page-p-medium-spacing)}.fd-layout-p-spacing--medium.fd-layout-p-spacing--right>*{margin-left:var(--page-p-medium-spacing)}.fd-layout-p-spacing--large.fd-layout-p-spacing--center>*,.fd-layout-p-spacing--large.fd-layout-p-spacing--left>*,.fd-layout-p-spacing--large.fd-layout-p-spacing--middle>*,.fd-layout-p-spacing--large>*{margin-right:var(--page-p-large-spacing)}.fd-layout-p-spacing--large.fd-layout-p-spacing--right>*{margin-left:var(--page-p-large-spacing)}.fd-layout-p-spacing>:first-child{margin-left:0}.fd-layout-p-spacing--center>:last-child,.fd-layout-p-spacing--left>:last-child,.fd-layout-p-spacing--middle>:last-child,.fd-layout-p-spacing--right>*,.fd-layout-p-spacing>:last-child{margin-right:0}.fd-layout-p-spacing--right>:first-child{margin-left:0}.fd-layout-p-spacing--space-around>*,.fd-layout-p-spacing--space-between>*,.fd-layout-p-spacing--space-evenly>*{margin-left:0;margin-right:0}.fd-layout-p-valign--top{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;vertical-align:top}.fd-layout-p-valign--stretch{-webkit-box-align:stretch;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch;vertical-align:middle}.fd-layout-p-valign--center,.fd-layout-p-valign--middle{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;vertical-align:middle}.fd-layout-p-valign--bottom{-webkit-box-align:end;-webkit-align-items:flex-end;-ms-flex-align:end;align-items:flex-end;vertical-align:bottom}.fd-layout-p-valign--baseline{-webkit-box-align:baseline;-webkit-align-items:baseline;-ms-flex-align:baseline;align-items:baseline;vertical-align:baseline}.fd-layout-page .fd-layout-p-align--right{text-align:right;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end}.fd-layout-page .fd-layout-p-align--left{text-align:left;-webkit-box-pack:start;-webkit-justify-content:flex-start;-ms-flex-pack:start;justify-content:flex-start}.fd-layout-page .fd-layout-p-align--center{text-align:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.fd-layout-page .fd-layout-p-align--space-between{-webkit-box-pack:justify;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between}.fd-layout-page .fd-layout-p-align--space-evenly{-webkit-box-pack:space-evenly;-webkit-justify-content:space-evenly;-ms-flex-pack:space-evenly;justify-content:space-evenly}.fd-layout-page .fd-layout-p-align--space-around{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}.fd-layout-grid{display:grid;grid-gap:var(--page-grid-gap);gap:var(--page-grid-gap)}.fd-layout-grid-align--left{justify-items:start}.fd-layout-grid-align--center,.fd-layout-grid-valign--middle{justify-items:center}.fd-layout-grid-align--right{justify-items:end}.fd-layout-grid-align--stretch{justify-items:stretch}.fd-layout-grid-valign--top{-webkit-box-align:start;-webkit-align-items:start;-ms-flex-align:start;align-items:start}.fd-layout-grid-valign--center,.fd-layout-grid-valign--middle{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.fd-layout-grid-valign--bottom{-webkit-box-align:end;-webkit-align-items:end;-ms-flex-align:end;align-items:end}.fd-layout-grid-valign--stretch{-webkit-box-align:stretch;-webkit-align-items:stretch;-ms-flex-align:stretch;align-items:stretch}.fd-layout-section{display:grid;-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:var(--page-padding-lr);padding-right:var(--page-padding-lr)}.fd-layout-section-block-wrapper,.fd-layout-section-head{width:100%;margin-left:auto;margin-right:auto}.fd-layout-section-block-wrapper{display:grid;height:100%;grid-gap:var(--page-block-gap);gap:var(--page-block-gap)}.fd-layout-section-inner--with-head{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;width:100%;grid-gap:var(--page-block-gap);gap:var(--page-block-gap)}.fd-layout-section-inner--with-head,.fd-layout-section-inner-without-head{max-width:var(--page-max-content-width);margin:0 auto}.fd-layout-section--no-gap{margin-bottom:0}.fd-layout-section-title,.fd-layout-section-title .fd-layout-p{color:var(--page-section-title-font-color)}.fd-layout-section-extra,.fd-layout-section-extra .fd-layout-p{color:var(--page-section-extra-font-color)}.fd-layout-section-no-padding{padding:0}.fd-layout-page-content--with-aside .fd-layout-section,.fd-layout-page-content--with-nav .fd-layout-section{padding-left:0;padding-right:0}.fd-layout-page-content--with-aside .fd-layout-section-inner,.fd-layout-page-content--with-nav .fd-layout-section-inner{max-width:none}.fd-layout-page--col-1 .fd-layout-section-block-wrapper,.fd-layout-page--col-1 .fd-layout-section-inner{grid-template-columns:repeat(1,1fr)}.fd-layout-page--col-1 .fd-layout-block--span-1,.fd-layout-page--col-1 .fd-layout-block--span-2,.fd-layout-page--col-1 .fd-layout-block--span-3,.fd-layout-page--col-1 .fd-layout-block--span-4,.fd-layout-page--col-1 .fd-layout-block--span-5,.fd-layout-page--col-1 .fd-layout-block--span-6,.fd-layout-page--col-1 .fd-layout-block--span-7,.fd-layout-page--col-1 .fd-layout-block--span-8,.fd-layout-page--col-1 .fd-layout-block--span-9,.fd-layout-page--col-1 .fd-layout-block--span-10,.fd-layout-page--col-1 .fd-layout-block--span-11,.fd-layout-page--col-1 .fd-layout-block--span-12,.fd-layout-page--col-1 .fd-layout-block--span-13,.fd-layout-page--col-1 .fd-layout-block--span-14,.fd-layout-page--col-1 .fd-layout-block--span-15,.fd-layout-page--col-1 .fd-layout-block--span-16,.fd-layout-page--col-1 .fd-layout-block--span-17,.fd-layout-page--col-1 .fd-layout-block--span-18,.fd-layout-page--col-1 .fd-layout-block--span-19,.fd-layout-page--col-1 .fd-layout-block--span-20,.fd-layout-page--col-1 .fd-layout-block--span-21,.fd-layout-page--col-1 .fd-layout-block--span-22,.fd-layout-page--col-1 .fd-layout-block--span-23,.fd-layout-page--col-1 .fd-layout-block--span-24{grid-column:span 1}.fd-layout-page--col-2 .fd-layout-section-block-wrapper,.fd-layout-page--col-2 .fd-layout-section-inner{grid-template-columns:repeat(2,1fr)}.fd-layout-page--col-2 .fd-layout-block--span-3,.fd-layout-page--col-2 .fd-layout-block--span-4,.fd-layout-page--col-2 .fd-layout-block--span-5,.fd-layout-page--col-2 .fd-layout-block--span-6,.fd-layout-page--col-2 .fd-layout-block--span-7,.fd-layout-page--col-2 .fd-layout-block--span-8,.fd-layout-page--col-2 .fd-layout-block--span-9,.fd-layout-page--col-2 .fd-layout-block--span-10,.fd-layout-page--col-2 .fd-layout-block--span-11,.fd-layout-page--col-2 .fd-layout-block--span-12,.fd-layout-page--col-2 .fd-layout-block--span-13,.fd-layout-page--col-2 .fd-layout-block--span-14,.fd-layout-page--col-2 .fd-layout-block--span-15,.fd-layout-page--col-2 .fd-layout-block--span-16,.fd-layout-page--col-2 .fd-layout-block--span-17,.fd-layout-page--col-2 .fd-layout-block--span-18,.fd-layout-page--col-2 .fd-layout-block--span-19,.fd-layout-page--col-2 .fd-layout-block--span-20,.fd-layout-page--col-2 .fd-layout-block--span-21,.fd-layout-page--col-2 .fd-layout-block--span-22,.fd-layout-page--col-2 .fd-layout-block--span-23,.fd-layout-page--col-2 .fd-layout-block--span-24{grid-column:span 2}.fd-layout-page--col-2 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-2 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-4 .fd-layout-section-block-wrapper,.fd-layout-page--col-4 .fd-layout-section-inner{grid-template-columns:repeat(4,1fr)}.fd-layout-page--col-4 .fd-layout-block--span-5,.fd-layout-page--col-4 .fd-layout-block--span-6,.fd-layout-page--col-4 .fd-layout-block--span-7,.fd-layout-page--col-4 .fd-layout-block--span-8,.fd-layout-page--col-4 .fd-layout-block--span-9,.fd-layout-page--col-4 .fd-layout-block--span-10,.fd-layout-page--col-4 .fd-layout-block--span-11,.fd-layout-page--col-4 .fd-layout-block--span-12,.fd-layout-page--col-4 .fd-layout-block--span-13,.fd-layout-page--col-4 .fd-layout-block--span-14,.fd-layout-page--col-4 .fd-layout-block--span-15,.fd-layout-page--col-4 .fd-layout-block--span-16,.fd-layout-page--col-4 .fd-layout-block--span-17,.fd-layout-page--col-4 .fd-layout-block--span-18,.fd-layout-page--col-4 .fd-layout-block--span-19,.fd-layout-page--col-4 .fd-layout-block--span-20,.fd-layout-page--col-4 .fd-layout-block--span-21,.fd-layout-page--col-4 .fd-layout-block--span-22,.fd-layout-page--col-4 .fd-layout-block--span-23,.fd-layout-page--col-4 .fd-layout-block--span-24{grid-column:span 4}.fd-layout-page--col-4 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-4 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-4 .fd-layout-block--span-3{grid-column:span 3}.fd-layout-page--col-4 .fd-layout-block--span-4{grid-column:span 4}.fd-layout-page--col-8 .fd-layout-section-block-wrapper,.fd-layout-page--col-8 .fd-layout-section-inner{grid-template-columns:repeat(8,1fr)}.fd-layout-page--col-8 .fd-layout-block--span-9,.fd-layout-page--col-8 .fd-layout-block--span-10,.fd-layout-page--col-8 .fd-layout-block--span-11,.fd-layout-page--col-8 .fd-layout-block--span-12,.fd-layout-page--col-8 .fd-layout-block--span-13,.fd-layout-page--col-8 .fd-layout-block--span-14,.fd-layout-page--col-8 .fd-layout-block--span-15,.fd-layout-page--col-8 .fd-layout-block--span-16,.fd-layout-page--col-8 .fd-layout-block--span-17,.fd-layout-page--col-8 .fd-layout-block--span-18,.fd-layout-page--col-8 .fd-layout-block--span-19,.fd-layout-page--col-8 .fd-layout-block--span-20,.fd-layout-page--col-8 .fd-layout-block--span-21,.fd-layout-page--col-8 .fd-layout-block--span-22,.fd-layout-page--col-8 .fd-layout-block--span-23,.fd-layout-page--col-8 .fd-layout-block--span-24{grid-column:span 8}.fd-layout-page--col-8 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-8 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-8 .fd-layout-block--span-3{grid-column:span 3}.fd-layout-page--col-8 .fd-layout-block--span-4{grid-column:span 4}.fd-layout-page--col-8 .fd-layout-block--span-5{grid-column:span 5}.fd-layout-page--col-8 .fd-layout-block--span-6{grid-column:span 6}.fd-layout-page--col-8 .fd-layout-block--span-7{grid-column:span 7}.fd-layout-page--col-8 .fd-layout-block--span-8{grid-column:span 8}.fd-layout-page--col-12 .fd-layout-section-block-wrapper,.fd-layout-page--col-12 .fd-layout-section-inner{grid-template-columns:repeat(12,1fr)}.fd-layout-page--col-12 .fd-layout-block--span-13,.fd-layout-page--col-12 .fd-layout-block--span-14,.fd-layout-page--col-12 .fd-layout-block--span-15,.fd-layout-page--col-12 .fd-layout-block--span-16,.fd-layout-page--col-12 .fd-layout-block--span-17,.fd-layout-page--col-12 .fd-layout-block--span-18,.fd-layout-page--col-12 .fd-layout-block--span-19,.fd-layout-page--col-12 .fd-layout-block--span-20,.fd-layout-page--col-12 .fd-layout-block--span-21,.fd-layout-page--col-12 .fd-layout-block--span-22,.fd-layout-page--col-12 .fd-layout-block--span-23,.fd-layout-page--col-12 .fd-layout-block--span-24{grid-column:span 12}.fd-layout-page--col-12 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-12 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-12 .fd-layout-block--span-3{grid-column:span 3}.fd-layout-page--col-12 .fd-layout-block--span-4{grid-column:span 4}.fd-layout-page--col-12 .fd-layout-block--span-5{grid-column:span 5}.fd-layout-page--col-12 .fd-layout-block--span-6{grid-column:span 6}.fd-layout-page--col-12 .fd-layout-block--span-7{grid-column:span 7}.fd-layout-page--col-12 .fd-layout-block--span-8{grid-column:span 8}.fd-layout-page--col-12 .fd-layout-block--span-9{grid-column:span 9}.fd-layout-page--col-12 .fd-layout-block--span-10{grid-column:span 10}.fd-layout-page--col-12 .fd-layout-block--span-11{grid-column:span 11}.fd-layout-page--col-12 .fd-layout-block--span-12{grid-column:span 12}.fd-layout-page--col-16 .fd-layout-section-block-wrapper,.fd-layout-page--col-16 .fd-layout-section-inner{grid-template-columns:repeat(16,1fr)}.fd-layout-page--col-16 .fd-layout-block--span-17,.fd-layout-page--col-16 .fd-layout-block--span-18,.fd-layout-page--col-16 .fd-layout-block--span-19,.fd-layout-page--col-16 .fd-layout-block--span-20,.fd-layout-page--col-16 .fd-layout-block--span-21,.fd-layout-page--col-16 .fd-layout-block--span-22,.fd-layout-page--col-16 .fd-layout-block--span-23,.fd-layout-page--col-16 .fd-layout-block--span-24{grid-column:span 16}.fd-layout-page--col-16 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-16 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-16 .fd-layout-block--span-3{grid-column:span 3}.fd-layout-page--col-16 .fd-layout-block--span-4{grid-column:span 4}.fd-layout-page--col-16 .fd-layout-block--span-5{grid-column:span 5}.fd-layout-page--col-16 .fd-layout-block--span-6{grid-column:span 6}.fd-layout-page--col-16 .fd-layout-block--span-7{grid-column:span 7}.fd-layout-page--col-16 .fd-layout-block--span-8{grid-column:span 8}.fd-layout-page--col-16 .fd-layout-block--span-9{grid-column:span 9}.fd-layout-page--col-16 .fd-layout-block--span-10{grid-column:span 10}.fd-layout-page--col-16 .fd-layout-block--span-11{grid-column:span 11}.fd-layout-page--col-16 .fd-layout-block--span-12{grid-column:span 12}.fd-layout-page--col-16 .fd-layout-block--span-13{grid-column:span 13}.fd-layout-page--col-16 .fd-layout-block--span-14{grid-column:span 14}.fd-layout-page--col-16 .fd-layout-block--span-15{grid-column:span 15}.fd-layout-page--col-16 .fd-layout-block--span-16{grid-column:span 16}.fd-layout-page--col-24 .fd-layout-section-block-wrapper,.fd-layout-page--col-24 .fd-layout-section-inner{grid-template-columns:repeat(24,1fr)}.fd-layout-page--col-24 .fd-layout-block--span-25{grid-column:span 24}.fd-layout-page--col-24 .fd-layout-block--span-1{grid-column:span 1}.fd-layout-page--col-24 .fd-layout-block--span-2{grid-column:span 2}.fd-layout-page--col-24 .fd-layout-block--span-3{grid-column:span 3}.fd-layout-page--col-24 .fd-layout-block--span-4{grid-column:span 4}.fd-layout-page--col-24 .fd-layout-block--span-5{grid-column:span 5}.fd-layout-page--col-24 .fd-layout-block--span-6{grid-column:span 6}.fd-layout-page--col-24 .fd-layout-block--span-7{grid-column:span 7}.fd-layout-page--col-24 .fd-layout-block--span-8{grid-column:span 8}.fd-layout-page--col-24 .fd-layout-block--span-9{grid-column:span 9}.fd-layout-page--col-24 .fd-layout-block--span-10{grid-column:span 10}.fd-layout-page--col-24 .fd-layout-block--span-11{grid-column:span 11}.fd-layout-page--col-24 .fd-layout-block--span-12{grid-column:span 12}.fd-layout-page--col-24 .fd-layout-block--span-13{grid-column:span 13}.fd-layout-page--col-24 .fd-layout-block--span-14{grid-column:span 14}.fd-layout-page--col-24 .fd-layout-block--span-15{grid-column:span 15}.fd-layout-page--col-24 .fd-layout-block--span-16{grid-column:span 16}.fd-layout-page--col-24 .fd-layout-block--span-17{grid-column:span 17}.fd-layout-page--col-24 .fd-layout-block--span-18{grid-column:span 18}.fd-layout-page--col-24 .fd-layout-block--span-19{grid-column:span 19}.fd-layout-page--col-24 .fd-layout-block--span-20{grid-column:span 20}.fd-layout-page--col-24 .fd-layout-block--span-21{grid-column:span 21}.fd-layout-page--col-24 .fd-layout-block--span-22{grid-column:span 22}.fd-layout-page--col-24 .fd-layout-block--span-23{grid-column:span 23}.fd-layout-page--col-24 .fd-layout-block--span-24{grid-column:span 24}.fd-layout-page--no-padding .fd-layout-section{padding-left:0;padding-right:0}.fd-layout-block{border-radius:var(--page-block-corner);overflow:hidden}.fd-layout-block--headless,.fd-layout-block-head{padding:var(--page-block-padding-tb) var(--page-block-padding-lr)}.fd-layout-block--bordered{border:var(--page-block-border-width) solid var(--page-block-border-color)}.fd-layout-block-content{padding-left:var(--page-block-padding-lr);padding-right:var(--page-block-padding-lr);padding-bottom:var(--page-block-padding-tb)}.fd-layout-block--no-padding,.fd-layout-block-content--no-padding{padding:0}.fd-layout-block-title,.fd-layout-block-title .fd-layout-p{color:var(--page-block-title-font-color)}.fd-layout-block-extra,.fd-layout-block-extra .fd-layout-p{color:var(--page-block-extra-font-color)}.fd-layout-block--divided .fd-layout-block-head{border-bottom:var(--line-1) solid var(--color-line1-1)}.fd-layout-block--divided .fd-layout-block-content{padding-top:var(--page-block-padding-tb)}.fd-layout--bg--lining{background:var(--color-lining)}.fd-layout--bg--surface{background:var(--color-surface)}.fd-layout--bg--transparent{background:var(--color-transparent)}.fd-layout-cell{-webkit-box-sizing:border-box;box-sizing:border-box}.fd-layout-cell-align--left{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start}.fd-layout-cell-align--center{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.fd-layout-cell-align--right{-webkit-box-align:end;-webkit-align-items:flex-end;-ms-flex-align:end;align-items:flex-end}.fd-layout-cell-align-stretch>*,.fd-layout-cell-align-stretch>text{margin-left:0;margin-right:0}.fd-layout-row-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-flex:1;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;grid-gap:var(--page-grid-gap);gap:var(--page-grid-gap)}.fd-layout-row-flex>.fd-layout-flex-item-valid-width{-webkit-box-flex:0;-webkit-flex:0 0;-ms-flex:0 0;flex:0 0}.fd-layout-row-flex>.fd-layout-fixed-container.fd-layout-flex-item-valid-height{-webkit-box-flex:1;-webkit-flex:1 1 0;-ms-flex:1 1 0px;flex:1 1 0}.fd-layout-col-flex{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-flex:1;-webkit-flex:1 1;-ms-flex:1 1;flex:1 1;grid-gap:var(--page-grid-gap);gap:var(--page-grid-gap)}.fd-layout-col-flex>.fd-layout-flex-item-valid-height{-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.fd-layout-col-flex>.fd-layout-flex-item-default,.fd-layout-row-flex>.fd-layout-flex-item-default{-webkit-box-flex:1;-webkit-flex:1 1 0;-ms-flex:1 1 0px;flex:1 1 0}.fd-layout-col-flex>.fd-layout-flex-item-auto-fit,.fd-layout-row-flex>.fd-layout-flex-item-auto-fit{-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto}.fd-layout-text-inherit{color:var(--page-body1-font-color);font-size:inherit;font-weight:inherit;font-family:inherit;line-height:inherit}.fd-layout-text-h1,.fd-layout-text .fd-layout-p--h1>a{color:var(--page-h1-font-color);font-size:var(--p-h1-font-size);font-weight:var(--p-h1-font-weight);line-height:var(--p-h1-line-height);font-family:var(--font-family-base)}.fd-layout-text-h2,.fd-layout-text .fd-layout-p--h2>a{color:var(--page-h2-font-color);font-size:var(--p-h2-font-size);font-weight:var(--p-h2-font-weight);line-height:var(--p-h2-line-height);font-family:var(--font-family-base)}.fd-layout-text-h3,.fd-layout-text .fd-layout-p--h3>a{color:var(--page-h3-font-color);font-size:var(--p-h3-font-size);font-weight:var(--p-h3-font-weight);line-height:var(--p-h3-line-height);font-family:var(--font-family-base)}.fd-layout-text-h4,.fd-layout-text .fd-layout-p--h4>a{color:var(--page-h4-font-color);font-size:var(--p-h4-font-size);font-weight:var(--p-h4-font-weight);line-height:var(--p-h4-line-height);font-family:var(--font-family-base)}.fd-layout-text-h5,.fd-layout-text .fd-layout-p--h5>a{color:var(--page-h5-font-color);font-size:var(--p-h5-font-size);font-weight:var(--p-h5-font-weight);line-height:var(--p-h5-line-height);font-family:var(--font-family-base)}.fd-layout-text-h6,.fd-layout-text .fd-layout-p--h6>a{color:var(--page-h6-font-color);font-size:var(--p-h6-font-size);font-weight:var(--p-h6-font-weight);line-height:var(--p-h6-line-height);font-family:var(--font-family-base)}.fd-layout-text-body1,.fd-layout-text .fd-layout-p--body1>a{color:var(--page-body1-font-color);font-size:var(--p-body1-font-size);font-weight:var(--p-body1-font-weight);line-height:var(--p-body1-line-height);font-family:var(--font-family-base)}.fd-layout-text-body2,.fd-layout-text .fd-layout-p--body2>a{color:var(--page-body2-font-color);font-size:var(--p-body2-font-size);font-weight:var(--p-body2-font-weight);line-height:var(--p-body2-line-height);font-family:var(--font-family-base)}.fd-layout-text-caption,.fd-layout-text .fd-layout-p--caption>a{color:var(--page-caption-font-color);font-size:var(--p-caption-font-size);font-weight:var(--p-caption-font-weight);line-height:var(--p-caption-line-height);font-family:var(--font-family-base)}.fd-layout-text-overline,.fd-layout-text .fd-layout-p--overline>a{color:var(--page-overline-font-color);font-size:var(--p-overline-font-size);font-weight:var(--p-overline-font-weight);line-height:var(--p-overline-line-height);font-family:var(--font-family-base)}.fd-layout-text{text-align:justify}.fd-layout-text-title{font-weight:700;margin-bottom:.5em}.fd-layout-text+.fd-layout-text-title{margin-top:1.2em}.fd-layout-text-paragraph{color:#1f2633;margin-bottom:1em;font-size:14px;line-height:1.5}.fd-layout-text mark{padding:0;background:#fffbc7;color:#1f2633}.fd-layout-text strong{font-weight:700}.fd-layout-text code{background-color:#f4f6f9;color:#1f2633;border:1px solid #e4e8ee;margin:0 .2em;padding:.2em .4em .1em;font-size:85%;border-radius:4px}.fd-layout-text ol,.fd-layout-text ul{margin:0 0 1em;padding:0}.fd-layout-text li{list-style-type:circle;margin:0 0 0 20px;padding:0 0 0 4px}.fd-layout-text a{text-decoration:none}.fd-layout-text a:link{color:#03c1fd}.fd-layout-text a:visited{color:#007bb0}.fd-layout-text a:hover{color:#009dd6}.fd-layout-text a:active{text-decoration:underline;color:#009dd6}h1.fd-layout-text-title{font-size:24px}h2.fd-layout-text-title{font-size:20px}h3.fd-layout-text-title,h4.fd-layout-text-title{font-size:16px}h5.fd-layout-text-title,h6.fd-layout-text-title{font-size:14px}:host,:root{--p-h1-font-size:var(--font-size-display-3);--p-h1-icon-size:var(--font-size-display-3);--p-h1-font-weight:var(--font-weight-3);--p-h1-line-height:var(--font-lineheight-2);--p-h2-font-size:var(--font-size-display-2);--p-h2-icon-size:var(--font-size-display-2);--p-h2-font-weight:var(--font-weight-3);--p-h2-line-height:var(--font-lineheight-2);--p-h3-font-size:var(--font-size-display-1);--p-h3-icon-size:var(--font-size-display-1);--p-h3-font-weight:var(--font-weight-3);--p-h3-line-height:var(--font-lineheight-2);--p-h4-font-size:var(--font-size-headline);--p-h4-icon-size:var(--font-size-headline);--p-h4-font-weight:var(--font-weight-semi-bold);--p-h4-line-height:var(--font-lineheight-1);--p-h5-font-size:var(--font-size-title);--p-h5-icon-size:var(--font-size-title);--p-h5-font-weight:var(--font-weight-medium);--p-h5-line-height:var(--font-lineheight-1);--p-h6-font-size:var(--font-size-subhead);--p-h6-icon-size:var(--font-size-subhead);--p-h6-font-weight:var(--font-weight-medium);--p-h6-line-height:var(--font-lineheight-1);--p-body1-font-size:var(--font-size-body-2);--p-body1-icon-size:var(--font-size-body-2);--p-body1-font-weight:var(--font-weight-2);--p-body1-line-height:var(--font-lineheight-1);--p-body2-font-size:var(--font-size-body-1);--p-body2-icon-size:var(--font-size-body-1);--p-body2-font-weight:var(--font-weight-2);--p-body2-line-height:var(--font-lineheight-1);--p-caption-font-size:var(--font-size-caption);--p-caption-icon-size:var(--font-size-caption);--p-caption-font-weight:var(--font-weight-light);--p-caption-line-height:var(--font-lineheight-1);--p-overline-font-size:var(--font-size-caption);--p-overline-icon-size:var(--font-size-caption);--p-overline-font-weight:var(--font-weight-thin);--p-overline-line-height:var(--font-lineheight-1);--color-transparent:transparent;--color-surface:#fff;--color-lining:#f0f0f0;--page-padding-lr:var(--s-5);--page-padding-tb:var(--s-5);--page-header-padding-lr:var(--page-padding-lr);--page-header-padding-top:var(--page-padding-tb);--page-header-padding-bottom:var(--page-block-padding-tb);--page-header-divider-color:var(--color-line1-2);--page-footer-padding-lr:var(--page-padding-lr);--page-footer-padding-bottom:var(--page-padding-tb);--page-footer-padding-top:var(--page-block-padding-tb);--page-block-corner:var(--corner-2);--page-block-padding-lr:var(--s-4);--page-block-padding-tb:var(--s-4);--page-block-padding-content:var(--page-block-padding-tb);--page-section-title-font-color:var(--color-text1-4);--page-section-extra-font-color:var(--color-text1-2);--page-block-title-font-color:var(--color-text1-4);--page-block-extra-font-color:var(--color-text1-2);--page-section-gap:var(--s-5);--page-block-gap:var(--s-4);--page-block-border-width:var(--line-1);--page-block-border-color:var(--color-line1-2);--page-grid-gap:var(--s-2);--page-p-small-spacing:var(--s-1);--page-p-medium-spacing:var(--s-2);--page-p-large-spacing:var(--s-4);--page-p-el-margin:var(--s-1);--page-p-font-color:var(--color-text1-4);--page-h1-font-color:var(--color-text1-4);--page-h2-font-color:var(--color-text1-4);--page-h3-font-color:var(--color-text1-4);--page-h4-font-color:var(--color-text1-4);--page-h5-font-color:var(--color-text1-4);--page-h6-font-color:var(--color-text1-4);--page-body1-font-color:var(--color-text1-4);--page-body2-font-color:var(--color-text1-3);--page-caption-font-color:var(--color-text1-3);--page-overline-font-color:var(--color-text1-3);--page-space-small-size:var(--s-2);--page-space-medium-size:var(--s-4);--page-space-large-size:var(--s-6)}.fd-layout-space--hoz{display:block}.fd-layout-space--ver{display:inline-block}.fd-layout-space--small.fd-layout-space--hoz{height:var(--page-space-small-size)}.fd-layout-space--small.fd-layout-space--ver{width:var(--page-space-small-size)}.fd-layout-space--medium.fd-layout-space--hoz{height:var(--page-space-medium-size)}.fd-layout-space--medium.fd-layout-space--ver{width:var(--page-space-medium-size)}.fd-layout-space--large.fd-layout-space--hoz{height:var(--page-space-large-size)}.fd-layout-space--large.fd-layout-space--ver{width:var(--page-space-large-size)}.fd-layout-float,.fd-layout-float+.fd-layout-float{margin:0 0 0 -2px}