@madgex/design-system 1.22.4 → 1.23.1

package/dist/_tokens/css/_tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 18 Sep 2019 11:13:04 GMT
+ * Generated on Thu, 19 Sep 2019 12:54:28 GMT
  */
 
 :root {

package/dist/_tokens/js/_tokens-module.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Wed, 18 Sep 2019 11:13:04 GMT
+ * Generated on Thu, 19 Sep 2019 12:54:28 GMT
  */
 
 module.exports = {

package/dist/_tokens/scss/_tokens.scss

@@ -1,7 +1,7 @@
 
 /*
   Do not edit directly
-  Generated on Wed, 18 Sep 2019 11:13:04 GMT
+  Generated on Thu, 19 Sep 2019 12:54:28 GMT
 */
 
 $mds-color-brand-1-base: #1b75bb !default;

package/dist/css/index.css

@@ -0,0 +1 @@
+html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font:inherit}*,*::before,*::after{box-sizing:border-box}ol,ul{list-style-type:none;list-style-position:outside}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace, monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type='button'],[type='reset'],[type='submit']{-webkit-appearance:button}button::-moz-focus-inner,[type='button']::-moz-focus-inner,[type='reset']::-moz-focus-inner,[type='submit']::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type='button']:-moz-focusring,[type='reset']:-moz-focusring,[type='submit']:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type='checkbox'],[type='radio']{box-sizing:border-box;padding:0}[type='number']::-webkit-inner-spin-button,[type='number']::-webkit-outer-spin-button{height:auto}[type='search']{-webkit-appearance:textfield;outline-offset:-2px}[type='search']::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.mds-visually-hidden{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);border:0;white-space:nowrap}h1{margin-bottom:24px}h2,h3,h4,h5,h6,p,ul,ol,dl,blockquote,pre{margin-bottom:12px}a{color:#1b75bb;text-decoration:none}a:hover,a:focus{color:#15598e;text-decoration:underline}img{max-width:100%}body{font-family:"Helvetica",Arial,sans-serif;color:#343433}h1,h2,h3,h4,h5,h6,dl dt{color:#222}html,body{background:#fff;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}.mds-site-container{width:100%;max-width:100%;min-width:0;margin:0 auto;background:#f8f8f8}.mds-wrapper{width:calc(100% - 20px);max-width:1280px;margin:0 auto;padding:0 1.5%}.mds-surface{background:#fff}.mds-surface__inner,.js .mds-tabs__tab,.js .mds-tabs__panel{padding:16px}@media (min-width: 37.5em){.mds-surface__inner,.js .mds-tabs__tab,.js .mds-tabs__panel{padding:calc(16px * 2)}}.mds-fixed-container{width:100%;background:#f8f8f8;position:fixed;left:0;bottom:0;z-index:5}.mds-fixed-container--top{bottom:auto;top:0}.mds-fixed-container--sticky{position:sticky}.mds-wrapper .mds-fixed-container--sticky{width:calc(100% + 3.02% + 20px);margin-left:calc((1.51% + 10px) * -1);margin-right:calc((1.51% + 10px) * -1)}@media (min-width: 37.5em){.mds-wrapper .mds-fixed-container--sticky{width:100%;margin-left:auto;margin-right:auto}}.mds-list{margin:0 0 20px 0;padding:0;list-style-type:none;list-style-position:inside}.mds-list__item{margin-bottom:4px;margin-left:16px}.mds-list__item:last-child{margin-bottom:0}.mds-list--bullet,.mds-list--number{margin-left:12px}.mds-list--bullet{list-style-type:disc}.mds-list--number{list-style-type:decimal}.mds-list--border{border-left:5px solid #f8f8f8;padding-left:20px;margin-left:0}.mds-list__key,.mds-list__value{margin:0}.mds-list__key{font-weight:bold;margin-bottom:4px}.mds-list__value{margin-bottom:12px}.mds-list__value:last-child{margin-bottom:0}.mds-list--inline{margin-left:0}.mds-list--inline li{display:inline-block;margin-bottom:0;margin-left:0;margin-right:8px}.mds-list--multilevel .mds-list{margin:8px 0 0 0}.mds-grid-row{box-sizing:border-box;display:flex;flex:0 1 auto;flex-direction:row;flex-wrap:wrap;margin-right:-10px;margin-left:-10px}.mds-grid-row.mds-grid-reverse{flex-direction:row-reverse}.mds-grid-col.mds-grid-reverse{flex-direction:column-reverse}.mds-grid-col,.mds-grid-col-1,.mds-grid-col-2,.mds-grid-col-3,.mds-grid-col-4,.mds-grid-col-5,.mds-grid-col-6,.mds-grid-col-7,.mds-grid-col-8,.mds-grid-col-9,.mds-grid-col-10,.mds-grid-col-11,.mds-grid-col-12,.mds-grid-col-offset-0,.mds-grid-col-offset-1,.mds-grid-col-offset-2,.mds-grid-col-offset-3,.mds-grid-col-offset-4,.mds-grid-col-offset-5,.mds-grid-col-offset-6,.mds-grid-col-offset-7,.mds-grid-col-offset-8,.mds-grid-col-offset-9,.mds-grid-col-offset-10,.mds-grid-col-offset-11,.mds-grid-col-offset-12{box-sizing:border-box;flex:0 0 auto;padding-right:10px;padding-left:10px}.mds-grid-col{flex-grow:1;flex-basis:0;max-width:100%}.mds-grid-col-1{flex-basis:8.33333333%;max-width:8.33333333%}.mds-grid-col-2{flex-basis:16.66666667%;max-width:16.66666667%}.mds-grid-col-3{flex-basis:25%;max-width:25%}.mds-grid-col-4{flex-basis:33.33333333%;max-width:33.33333333%}.mds-grid-col-5{flex-basis:41.66666667%;max-width:41.66666667%}.mds-grid-col-6{flex-basis:50%;max-width:50%}.mds-grid-col-7{flex-basis:58.33333333%;max-width:58.33333333%}.mds-grid-col-8{flex-basis:66.66666667%;max-width:66.66666667%}.mds-grid-col-9{flex-basis:75%;max-width:75%}.mds-grid-col-10{flex-basis:83.33333333%;max-width:83.33333333%}.mds-grid-col-11{flex-basis:91.66666667%;max-width:91.66666667%}.mds-grid-col-12{flex-basis:100%;max-width:100%}.mds-grid-col-offset-0{margin-left:0}.mds-grid-col-offset-1{margin-left:8.33333333%}.mds-grid-col-offset-2{margin-left:16.66666667%}.mds-grid-col-offset-3{margin-left:25%}.mds-grid-col-offset-4{margin-left:33.33333333%}.mds-grid-col-offset-5{margin-left:41.66666667%}.mds-grid-col-offset-6{margin-left:50%}.mds-grid-col-offset-7{margin-left:58.33333333%}.mds-grid-col-offset-8{margin-left:66.66666667%}.mds-grid-col-offset-9{margin-left:75%}.mds-grid-col-offset-10{margin-left:83.33333333%}.mds-grid-col-offset-11{margin-left:91.66666667%}.mds-grid-start{justify-content:flex-start;text-align:start}.mds-grid-center{justify-content:center;text-align:center}.mds-grid-end{justify-content:flex-end;text-align:end}.mds-grid-top{align-items:flex-start}.mds-grid-middle{align-items:center}.mds-grid-bottom{align-items:flex-end}.mds-grid-around{justify-content:space-around}.mds-grid-between{justify-content:space-between}.mds-grid-first{order:-1}.mds-grid-last{order:1}@media only screen and (min-width: 400px){.mds-grid-col-sm,.mds-grid-col-sm-1,.mds-grid-col-sm-2,.mds-grid-col-sm-3,.mds-grid-col-sm-4,.mds-grid-col-sm-5,.mds-grid-col-sm-6,.mds-grid-col-sm-7,.mds-grid-col-sm-8,.mds-grid-col-sm-9,.mds-grid-col-sm-10,.mds-grid-col-sm-11,.mds-grid-col-sm-12,.mds-grid-col-sm-offset-0,.mds-grid-col-sm-offset-1,.mds-grid-col-sm-offset-2,.mds-grid-col-sm-offset-3,.mds-grid-col-sm-offset-4,.mds-grid-col-sm-offset-5,.mds-grid-col-sm-offset-6,.mds-grid-col-sm-offset-7,.mds-grid-col-sm-offset-8,.mds-grid-col-sm-offset-9,.mds-grid-col-sm-offset-10,.mds-grid-col-sm-offset-11,.mds-grid-col-sm-offset-12{box-sizing:border-box;flex:0 0 auto;padding-right:10px;padding-left:10px}.mds-grid-col-sm{flex-grow:1;flex-basis:0;max-width:100%}.mds-grid-col-sm-1{flex-basis:8.33333333%;max-width:8.33333333%}.mds-grid-col-sm-2{flex-basis:16.66666667%;max-width:16.66666667%}.mds-grid-col-sm-3{flex-basis:25%;max-width:25%}.mds-grid-col-sm-4{flex-basis:33.33333333%;max-width:33.33333333%}.mds-grid-col-sm-5{flex-basis:41.66666667%;max-width:41.66666667%}.mds-grid-col-sm-6{flex-basis:50%;max-width:50%}.mds-grid-col-sm-7{flex-basis:58.33333333%;max-width:58.33333333%}.mds-grid-col-sm-8{flex-basis:66.66666667%;max-width:66.66666667%}.mds-grid-col-sm-9{flex-basis:75%;max-width:75%}.mds-grid-col-sm-10{flex-basis:83.33333333%;max-width:83.33333333%}.mds-grid-col-sm-11{flex-basis:91.66666667%;max-width:91.66666667%}.mds-grid-col-sm-12{flex-basis:100%;max-width:100%}.mds-grid-col-sm-offset-0{margin-left:0}.mds-grid-col-sm-offset-1{margin-left:8.33333333%}.mds-grid-col-sm-offset-2{margin-left:16.66666667%}.mds-grid-col-sm-offset-3{margin-left:25%}.mds-grid-col-sm-offset-4{margin-left:33.33333333%}.mds-grid-col-sm-offset-5{margin-left:41.66666667%}.mds-grid-col-sm-offset-6{margin-left:50%}.mds-grid-col-sm-offset-7{margin-left:58.33333333%}.mds-grid-col-sm-offset-8{margin-left:66.66666667%}.mds-grid-col-sm-offset-9{margin-left:75%}.mds-grid-col-sm-offset-10{margin-left:83.33333333%}.mds-grid-col-sm-offset-11{margin-left:91.66666667%}.mds-grid-start-sm{justify-content:flex-start;text-align:start}.mds-grid-center-sm{justify-content:center;text-align:center}.mds-grid-end-sm{justify-content:flex-end;text-align:end}.mds-grid-top-sm{align-items:flex-start}.mds-grid-middle-sm{align-items:center}.mds-grid-bottom-sm{align-items:flex-end}.mds-grid-around-sm{justify-content:space-around}.mds-grid-between-sm{justify-content:space-between}.mds-grid-first-sm{order:-1}.mds-grid-last-sm{order:1}}@media only screen and (min-width: 600px){.mds-grid-col-md,.mds-grid-col-md-1,.mds-grid-col-md-2,.mds-grid-col-md-3,.mds-grid-col-md-4,.mds-grid-col-md-5,.mds-grid-col-md-6,.mds-grid-col-md-7,.mds-grid-col-md-8,.mds-grid-col-md-9,.mds-grid-col-md-10,.mds-grid-col-md-11,.mds-grid-col-md-12,.mds-grid-col-md-offset-0,.mds-grid-col-md-offset-1,.mds-grid-col-md-offset-2,.mds-grid-col-md-offset-3,.mds-grid-col-md-offset-4,.mds-grid-col-md-offset-5,.mds-grid-col-md-offset-6,.mds-grid-col-md-offset-7,.mds-grid-col-md-offset-8,.mds-grid-col-md-offset-9,.mds-grid-col-md-offset-10,.mds-grid-col-md-offset-11,.mds-grid-col-md-offset-12{box-sizing:border-box;flex:0 0 auto;padding-right:10px;padding-left:10px}.mds-grid-col-md{flex-grow:1;flex-basis:0;max-width:100%}.mds-grid-col-md-1{flex-basis:8.33333333%;max-width:8.33333333%}.mds-grid-col-md-2{flex-basis:16.66666667%;max-width:16.66666667%}.mds-grid-col-md-3{flex-basis:25%;max-width:25%}.mds-grid-col-md-4{flex-basis:33.33333333%;max-width:33.33333333%}.mds-grid-col-md-5{flex-basis:41.66666667%;max-width:41.66666667%}.mds-grid-col-md-6{flex-basis:50%;max-width:50%}.mds-grid-col-md-7{flex-basis:58.33333333%;max-width:58.33333333%}.mds-grid-col-md-8{flex-basis:66.66666667%;max-width:66.66666667%}.mds-grid-col-md-9{flex-basis:75%;max-width:75%}.mds-grid-col-md-10{flex-basis:83.33333333%;max-width:83.33333333%}.mds-grid-col-md-11{flex-basis:91.66666667%;max-width:91.66666667%}.mds-grid-col-md-12{flex-basis:100%;max-width:100%}.mds-grid-col-md-offset-0{margin-left:0}.mds-grid-col-md-offset-1{margin-left:8.33333333%}.mds-grid-col-md-offset-2{margin-left:16.66666667%}.mds-grid-col-md-offset-3{margin-left:25%}.mds-grid-col-md-offset-4{margin-left:33.33333333%}.mds-grid-col-md-offset-5{margin-left:41.66666667%}.mds-grid-col-md-offset-6{margin-left:50%}.mds-grid-col-md-offset-7{margin-left:58.33333333%}.mds-grid-col-md-offset-8{margin-left:66.66666667%}.mds-grid-col-md-offset-9{margin-left:75%}.mds-grid-col-md-offset-10{margin-left:83.33333333%}.mds-grid-col-md-offset-11{margin-left:91.66666667%}.mds-grid-start-md{justify-content:flex-start;text-align:start}.mds-grid-center-md{justify-content:center;text-align:center}.mds-grid-end-md{justify-content:flex-end;text-align:end}.mds-grid-top-md{align-items:flex-start}.mds-grid-middle-md{align-items:center}.mds-grid-bottom-md{align-items:flex-end}.mds-grid-around-md{justify-content:space-around}.mds-grid-between-md{justify-content:space-between}.mds-grid-first-md{order:-1}.mds-grid-last-md{order:1}}@media only screen and (min-width: 1008px){.mds-grid-col-lg,.mds-grid-col-lg-1,.mds-grid-col-lg-2,.mds-grid-col-lg-3,.mds-grid-col-lg-4,.mds-grid-col-lg-5,.mds-grid-col-lg-6,.mds-grid-col-lg-7,.mds-grid-col-lg-8,.mds-grid-col-lg-9,.mds-grid-col-lg-10,.mds-grid-col-lg-11,.mds-grid-col-lg-12,.mds-grid-col-lg-offset-0,.mds-grid-col-lg-offset-1,.mds-grid-col-lg-offset-2,.mds-grid-col-lg-offset-3,.mds-grid-col-lg-offset-4,.mds-grid-col-lg-offset-5,.mds-grid-col-lg-offset-6,.mds-grid-col-lg-offset-7,.mds-grid-col-lg-offset-8,.mds-grid-col-lg-offset-9,.mds-grid-col-lg-offset-10,.mds-grid-col-lg-offset-11,.mds-grid-col-lg-offset-12{box-sizing:border-box;flex:0 0 auto;padding-right:10px;padding-left:10px}.mds-grid-col-lg{flex-grow:1;flex-basis:0;max-width:100%}.mds-grid-col-lg-1{flex-basis:8.33333333%;max-width:8.33333333%}.mds-grid-col-lg-2{flex-basis:16.66666667%;max-width:16.66666667%}.mds-grid-col-lg-3{flex-basis:25%;max-width:25%}.mds-grid-col-lg-4{flex-basis:33.33333333%;max-width:33.33333333%}.mds-grid-col-lg-5{flex-basis:41.66666667%;max-width:41.66666667%}.mds-grid-col-lg-6{flex-basis:50%;max-width:50%}.mds-grid-col-lg-7{flex-basis:58.33333333%;max-width:58.33333333%}.mds-grid-col-lg-8{flex-basis:66.66666667%;max-width:66.66666667%}.mds-grid-col-lg-9{flex-basis:75%;max-width:75%}.mds-grid-col-lg-10{flex-basis:83.33333333%;max-width:83.33333333%}.mds-grid-col-lg-11{flex-basis:91.66666667%;max-width:91.66666667%}.mds-grid-col-lg-12{flex-basis:100%;max-width:100%}.mds-grid-col-lg-offset-0{margin-left:0}.mds-grid-col-lg-offset-1{margin-left:8.33333333%}.mds-grid-col-lg-offset-2{margin-left:16.66666667%}.mds-grid-col-lg-offset-3{margin-left:25%}.mds-grid-col-lg-offset-4{margin-left:33.33333333%}.mds-grid-col-lg-offset-5{margin-left:41.66666667%}.mds-grid-col-lg-offset-6{margin-left:50%}.mds-grid-col-lg-offset-7{margin-left:58.33333333%}.mds-grid-col-lg-offset-8{margin-left:66.66666667%}.mds-grid-col-lg-offset-9{margin-left:75%}.mds-grid-col-lg-offset-10{margin-left:83.33333333%}.mds-grid-col-lg-offset-11{margin-left:91.66666667%}.mds-grid-start-lg{justify-content:flex-start;text-align:start}.mds-grid-center-lg{justify-content:center;text-align:center}.mds-grid-end-lg{justify-content:flex-end;text-align:end}.mds-grid-top-lg{align-items:flex-start}.mds-grid-middle-lg{align-items:center}.mds-grid-bottom-lg{align-items:flex-end}.mds-grid-around-lg{justify-content:space-around}.mds-grid-between-lg{justify-content:space-between}.mds-grid-first-lg{order:-1}.mds-grid-last-lg{order:1}}@media only screen and (min-width: 1280px){.mds-grid-col-xl,.mds-grid-col-xl-1,.mds-grid-col-xl-2,.mds-grid-col-xl-3,.mds-grid-col-xl-4,.mds-grid-col-xl-5,.mds-grid-col-xl-6,.mds-grid-col-xl-7,.mds-grid-col-xl-8,.mds-grid-col-xl-9,.mds-grid-col-xl-10,.mds-grid-col-xl-11,.mds-grid-col-xl-12,.mds-grid-col-xl-offset-0,.mds-grid-col-xl-offset-1,.mds-grid-col-xl-offset-2,.mds-grid-col-xl-offset-3,.mds-grid-col-xl-offset-4,.mds-grid-col-xl-offset-5,.mds-grid-col-xl-offset-6,.mds-grid-col-xl-offset-7,.mds-grid-col-xl-offset-8,.mds-grid-col-xl-offset-9,.mds-grid-col-xl-offset-10,.mds-grid-col-xl-offset-11,.mds-grid-col-xl-offset-12{box-sizing:border-box;flex:0 0 auto;padding-right:10px;padding-left:10px}.mds-grid-col-xl{flex-grow:1;flex-basis:0;max-width:100%}.mds-grid-col-xl-1{flex-basis:8.33333333%;max-width:8.33333333%}.mds-grid-col-xl-2{flex-basis:16.66666667%;max-width:16.66666667%}.mds-grid-col-xl-3{flex-basis:25%;max-width:25%}.mds-grid-col-xl-4{flex-basis:33.33333333%;max-width:33.33333333%}.mds-grid-col-xl-5{flex-basis:41.66666667%;max-width:41.66666667%}.mds-grid-col-xl-6{flex-basis:50%;max-width:50%}.mds-grid-col-xl-7{flex-basis:58.33333333%;max-width:58.33333333%}.mds-grid-col-xl-8{flex-basis:66.66666667%;max-width:66.66666667%}.mds-grid-col-xl-9{flex-basis:75%;max-width:75%}.mds-grid-col-xl-10{flex-basis:83.33333333%;max-width:83.33333333%}.mds-grid-col-xl-11{flex-basis:91.66666667%;max-width:91.66666667%}.mds-grid-col-xl-12{flex-basis:100%;max-width:100%}.mds-grid-col-xl-offset-0{margin-left:0}.mds-grid-col-xl-offset-1{margin-left:8.33333333%}.mds-grid-col-xl-offset-2{margin-left:16.66666667%}.mds-grid-col-xl-offset-3{margin-left:25%}.mds-grid-col-xl-offset-4{margin-left:33.33333333%}.mds-grid-col-xl-offset-5{margin-left:41.66666667%}.mds-grid-col-xl-offset-6{margin-left:50%}.mds-grid-col-xl-offset-7{margin-left:58.33333333%}.mds-grid-col-xl-offset-8{margin-left:66.66666667%}.mds-grid-col-xl-offset-9{margin-left:75%}.mds-grid-col-xl-offset-10{margin-left:83.33333333%}.mds-grid-col-xl-offset-11{margin-left:91.66666667%}.mds-grid-start-xl{justify-content:flex-start;text-align:start}.mds-grid-center-xl{justify-content:center;text-align:center}.mds-grid-end-xl{justify-content:flex-end;text-align:end}.mds-grid-top-xl{align-items:flex-start}.mds-grid-middle-xl{align-items:center}.mds-grid-bottom-xl{align-items:flex-end}.mds-grid-around-xl{justify-content:space-around}.mds-grid-between-xl{justify-content:space-between}.mds-grid-first-xl{order:-1}.mds-grid-last-xl{order:1}}.mds-message.mds-message--error{color:#3d0108;background-color:#ffe6e9;border-color:#e1021d}.mds-message.mds-message--success{color:#1b320b;background-color:#f1faea;border-color:#5ba927}.mds-message.mds-message--info{color:#3d2a00;background-color:#fff7e6;border-color:#ffb411}.mds-icon{display:inline-block;fill:currentColor;width:1em;height:1em;position:relative;top:0.125em}.mds-icon--sm{width:16px;height:16px}.mds-icon--md{width:24px;height:24px}.mds-icon--lg{width:32px;height:32px}.mds-icon--before{margin-right:0.66em}.mds-icon--after{margin-left:0.66em}.mds-button{cursor:pointer;user-select:none;vertical-align:middle;-webkit-appearance:none;width:auto;border:1px solid transparent;border-radius:4px;background-color:#f0af11;padding:12px 20px;display:inline-block;text-align:center;color:#343433}@media (min-width: 37.5em){.mds-button{padding:8px 20px}}.mds-button:link,.mds-button:visited,.mds-button:active{text-decoration:none;color:#343433}.mds-button:hover,.mds-button:focus{background-color:#f3bf41;text-decoration:none;color:#343433}.mds-button--small{padding:8px 12px}@media (min-width: 37.5em){.mds-button--small{padding:4px 12px}}.mds-button--large{padding:16px 24px}.mds-card{padding:12px 16px;border:1px solid #ddd}.mds-card>*:last-child{margin-bottom:0}.mds-card--highlighted{background:#f8f8f8}.mds-section-title{border-bottom:1px solid #ddd}.js .mds-tabs__panel--hidden{display:none}.mds-tabs__list{margin-bottom:8px}.js .mds-tabs__list{margin-bottom:0}.js .mds-tabs__list-item{display:inline-block;width:50%}@media (min-width: 37.5em){.js .mds-tabs__list-item{width:auto}}.mds-tabs__tab{display:inline-block;margin-bottom:8px}.js .mds-tabs__tab{width:100%;text-decoration:none;text-align:center;margin-right:4px;margin-bottom:0;padding-top:24px;padding-bottom:20px}@media (min-width: 37.5em){.js .mds-tabs__tab{text-align:left}}.js .mds-tabs__tab.mds-tabs__tab--selected{border-bottom:6px solid #1b75bb;color:#222}.mds-input{width:100%;background-color:#f8f8f8;height:2rem;margin:4px 0;padding:4px}.mds-input__label{font-weight:600}.mds-input__label--hint{font-weight:normal;color:#979797}.mds-input__validation-message{display:block;text-align:right}.mds-input__validation-message--error{color:#e1021d}.mds-input--error{border-color:#e1021d}.mds-textarea{resize:none;width:100%;background-color:#f8f8f8;margin:4px 0;padding:8px}.mds-font-canon{font-size:1.75rem;line-height:1.15}@media (min-width: 25em){.mds-font-canon{font-size:2rem;line-height:1.13}}@media (min-width: 37.5em){.mds-font-canon{font-size:3.25rem;line-height:1.08}}@media (min-width: 63em){.mds-font-canon{font-size:2.75rem;line-height:1.1}}.mds-font-trafalgar,h1{font-size:1.25rem;line-height:1.2}@media (min-width: 25em){.mds-font-trafalgar,h1{font-size:1.5rem;line-height:1.17}}@media (min-width: 37.5em){.mds-font-trafalgar,h1{font-size:2.25rem;line-height:1.12}}@media (min-width: 63em){.mds-font-trafalgar,h1{font-size:2rem;line-height:1.13}}.mds-font-paragon{font-size:1.25rem;line-height:1.2}@media (min-width: 25em){.mds-font-paragon{font-size:1.375rem;line-height:1.19}}@media (min-width: 37.5em){.mds-font-paragon{font-size:1.75rem;line-height:1.15}}@media (min-width: 63em){.mds-font-paragon{font-size:1.75rem;line-height:1.15}}.mds-font-double-pica,h2{font-size:1.25rem;line-height:1.2}@media (min-width: 25em){.mds-font-double-pica,h2{font-size:1.25rem;line-height:1.2}}@media (min-width: 37.5em){.mds-font-double-pica,h2{font-size:1.625rem;line-height:1.16}}@media (min-width: 63em){.mds-font-double-pica,h2{font-size:1.5rem;line-height:1.17}}.mds-font-great-primer,h3,.js .mds-tabs__list-item{font-size:1.125rem;line-height:1.23}@media (min-width: 25em){.mds-font-great-primer,h3,.js .mds-tabs__list-item{font-size:1.125rem;line-height:1.23}}@media (min-width: 37.5em){.mds-font-great-primer,h3,.js .mds-tabs__list-item{font-size:1.3125rem;line-height:1.15}}@media (min-width: 63em){.mds-font-great-primer,h3,.js .mds-tabs__list-item{font-size:1.25rem;line-height:1.2}}.mds-font-body-copy,body,h4,.mds-button{font-size:1rem;line-height:1.38}@media (min-width: 25em){.mds-font-body-copy,body,h4,.mds-button{font-size:1rem;line-height:1.38}}@media (min-width: 37.5em){.mds-font-body-copy,body,h4,.mds-button{font-size:1.125rem;line-height:1.34}}@media (min-width: 63em){.mds-font-body-copy,body,h4,.mds-button{font-size:1rem;line-height:1.38}}.mds-font-body-copy-bulk{font-size:1rem;line-height:1.75}@media (min-width: 25em){.mds-font-body-copy-bulk{font-size:1rem;line-height:1.75}}@media (min-width: 37.5em){.mds-font-body-copy-bulk{font-size:1.125rem;line-height:1.67}}@media (min-width: 63em){.mds-font-body-copy-bulk{font-size:1rem;line-height:1.75}}.mds-font-pica{font-size:.9375rem;line-height:1.34}@media (min-width: 25em){.mds-font-pica{font-size:1rem;line-height:1.25}}@media (min-width: 37.5em){.mds-font-pica{font-size:1.125rem;line-height:1.23}}@media (min-width: 63em){.mds-font-pica{font-size:1rem;line-height:1.25}}.mds-font-long-primer{font-size:.9375rem;line-height:1.2}@media (min-width: 25em){.mds-font-long-primer{font-size:.9375rem;line-height:1.2}}@media (min-width: 37.5em){.mds-font-long-primer{font-size:.9375rem;line-height:1.34}}@media (min-width: 63em){.mds-font-long-primer{font-size:.875rem;line-height:1.29}}.mds-font-brevier{font-size:.875rem;line-height:1.15}@media (min-width: 25em){.mds-font-brevier{font-size:.875rem;line-height:1.29}}@media (min-width: 37.5em){.mds-font-brevier{font-size:.875rem;line-height:1.29}}@media (min-width: 63em){.mds-font-brevier{font-size:.8125rem;line-height:1.24}}.mds-font-minion,.mds-list__key{font-size:.75rem;line-height:1.34}@media (min-width: 25em){.mds-font-minion,.mds-list__key{font-size:.75rem;line-height:1.34}}@media (min-width: 37.5em){.mds-font-minion,.mds-list__key{font-size:.8125rem;line-height:1.24}}@media (min-width: 63em){.mds-font-minion,.mds-list__key{font-size:.75rem;line-height:1.34}}.mds-padding-b0{padding:0px}.mds-margin-b0{margin:0px}.mds-padding-b1{padding:4px}.mds-margin-b1{margin:4px}.mds-padding-b2{padding:8px}.mds-margin-b2{margin:8px}.mds-padding-b3,.mds-message{padding:12px}.mds-margin-b3{margin:12px}.mds-padding-b4{padding:16px}.mds-margin-b4{margin:16px}.mds-padding-b5{padding:20px}.mds-margin-b5{margin:20px}.mds-padding-b6{padding:24px}.mds-margin-b6{margin:24px}.mds-padding-b7{padding:28px}.mds-margin-b7{margin:28px}.mds-padding-b8{padding:32px}.mds-margin-b8{margin:32px}.mds-padding-b9{padding:36px}.mds-margin-b9{margin:36px}.mds-padding-b10{padding:40px}.mds-margin-b10{margin:40px}@media (min-width: 25em){.mds-padding-sm-b0{padding:0px}.mds-margin-sm-b0{margin:0px}}@media (min-width: 37.5em){.mds-padding-md-b0{padding:0px}.mds-margin-md-b0{margin:0px}}@media (min-width: 63em){.mds-padding-lg-b0{padding:0px}.mds-margin-lg-b0{margin:0px}}@media (min-width: 80em){.mds-padding-xl-b0{padding:0px}.mds-margin-xl-b0{margin:0px}}@media (min-width: 25em){.mds-padding-sm-b1{padding:4px}.mds-margin-sm-b1{margin:4px}}@media (min-width: 37.5em){.mds-padding-md-b1{padding:4px}.mds-margin-md-b1{margin:4px}}@media (min-width: 63em){.mds-padding-lg-b1{padding:4px}.mds-margin-lg-b1{margin:4px}}@media (min-width: 80em){.mds-padding-xl-b1{padding:4px}.mds-margin-xl-b1{margin:4px}}@media (min-width: 25em){.mds-padding-sm-b2{padding:8px}.mds-margin-sm-b2{margin:8px}}@media (min-width: 37.5em){.mds-padding-md-b2{padding:8px}.mds-margin-md-b2{margin:8px}}@media (min-width: 63em){.mds-padding-lg-b2{padding:8px}.mds-margin-lg-b2{margin:8px}}@media (min-width: 80em){.mds-padding-xl-b2{padding:8px}.mds-margin-xl-b2{margin:8px}}@media (min-width: 25em){.mds-padding-sm-b3{padding:12px}.mds-margin-sm-b3{margin:12px}}@media (min-width: 37.5em){.mds-padding-md-b3{padding:12px}.mds-margin-md-b3{margin:12px}}@media (min-width: 63em){.mds-padding-lg-b3{padding:12px}.mds-margin-lg-b3{margin:12px}}@media (min-width: 80em){.mds-padding-xl-b3{padding:12px}.mds-margin-xl-b3{margin:12px}}@media (min-width: 25em){.mds-padding-sm-b4{padding:16px}.mds-margin-sm-b4{margin:16px}}@media (min-width: 37.5em){.mds-padding-md-b4{padding:16px}.mds-margin-md-b4{margin:16px}}@media (min-width: 63em){.mds-padding-lg-b4{padding:16px}.mds-margin-lg-b4{margin:16px}}@media (min-width: 80em){.mds-padding-xl-b4{padding:16px}.mds-margin-xl-b4{margin:16px}}@media (min-width: 25em){.mds-padding-sm-b5{padding:20px}.mds-margin-sm-b5{margin:20px}}@media (min-width: 37.5em){.mds-padding-md-b5{padding:20px}.mds-margin-md-b5{margin:20px}}@media (min-width: 63em){.mds-padding-lg-b5{padding:20px}.mds-margin-lg-b5{margin:20px}}@media (min-width: 80em){.mds-padding-xl-b5{padding:20px}.mds-margin-xl-b5{margin:20px}}@media (min-width: 25em){.mds-padding-sm-b6{padding:24px}.mds-margin-sm-b6{margin:24px}}@media (min-width: 37.5em){.mds-padding-md-b6{padding:24px}.mds-margin-md-b6{margin:24px}}@media (min-width: 63em){.mds-padding-lg-b6{padding:24px}.mds-margin-lg-b6{margin:24px}}@media (min-width: 80em){.mds-padding-xl-b6{padding:24px}.mds-margin-xl-b6{margin:24px}}@media (min-width: 25em){.mds-padding-sm-b7{padding:28px}.mds-margin-sm-b7{margin:28px}}@media (min-width: 37.5em){.mds-padding-md-b7{padding:28px}.mds-margin-md-b7{margin:28px}}@media (min-width: 63em){.mds-padding-lg-b7{padding:28px}.mds-margin-lg-b7{margin:28px}}@media (min-width: 80em){.mds-padding-xl-b7{padding:28px}.mds-margin-xl-b7{margin:28px}}@media (min-width: 25em){.mds-padding-sm-b8{padding:32px}.mds-margin-sm-b8{margin:32px}}@media (min-width: 37.5em){.mds-padding-md-b8{padding:32px}.mds-margin-md-b8{margin:32px}}@media (min-width: 63em){.mds-padding-lg-b8{padding:32px}.mds-margin-lg-b8{margin:32px}}@media (min-width: 80em){.mds-padding-xl-b8{padding:32px}.mds-margin-xl-b8{margin:32px}}@media (min-width: 25em){.mds-padding-sm-b9{padding:36px}.mds-margin-sm-b9{margin:36px}}@media (min-width: 37.5em){.mds-padding-md-b9{padding:36px}.mds-margin-md-b9{margin:36px}}@media (min-width: 63em){.mds-padding-lg-b9{padding:36px}.mds-margin-lg-b9{margin:36px}}@media (min-width: 80em){.mds-padding-xl-b9{padding:36px}.mds-margin-xl-b9{margin:36px}}@media (min-width: 25em){.mds-padding-sm-b10{padding:40px}.mds-margin-sm-b10{margin:40px}}@media (min-width: 37.5em){.mds-padding-md-b10{padding:40px}.mds-margin-md-b10{margin:40px}}@media (min-width: 63em){.mds-padding-lg-b10{padding:40px}.mds-margin-lg-b10{margin:40px}}@media (min-width: 80em){.mds-padding-xl-b10{padding:40px}.mds-margin-xl-b10{margin:40px}}.mds-padding-top-b0{padding-top:0px}.mds-margin-top-b0{margin-top:0px}.mds-padding-right-b0{padding-right:0px}.mds-margin-right-b0{margin-right:0px}.mds-padding-bottom-b0{padding-bottom:0px}.mds-margin-bottom-b0{margin-bottom:0px}.mds-padding-left-b0{padding-left:0px}.mds-margin-left-b0{margin-left:0px}.mds-padding-top-b1{padding-top:4px}.mds-margin-top-b1{margin-top:4px}.mds-padding-right-b1{padding-right:4px}.mds-margin-right-b1{margin-right:4px}.mds-padding-bottom-b1{padding-bottom:4px}.mds-margin-bottom-b1{margin-bottom:4px}.mds-padding-left-b1{padding-left:4px}.mds-margin-left-b1{margin-left:4px}.mds-padding-top-b2{padding-top:8px}.mds-margin-top-b2{margin-top:8px}.mds-padding-right-b2{padding-right:8px}.mds-margin-right-b2{margin-right:8px}.mds-padding-bottom-b2{padding-bottom:8px}.mds-margin-bottom-b2{margin-bottom:8px}.mds-padding-left-b2{padding-left:8px}.mds-margin-left-b2{margin-left:8px}.mds-padding-top-b3{padding-top:12px}.mds-margin-top-b3{margin-top:12px}.mds-padding-right-b3{padding-right:12px}.mds-margin-right-b3{margin-right:12px}.mds-padding-bottom-b3{padding-bottom:12px}.mds-margin-bottom-b3{margin-bottom:12px}.mds-padding-left-b3{padding-left:12px}.mds-margin-left-b3{margin-left:12px}.mds-padding-top-b4{padding-top:16px}.mds-margin-top-b4{margin-top:16px}.mds-padding-right-b4{padding-right:16px}.mds-margin-right-b4{margin-right:16px}.mds-padding-bottom-b4{padding-bottom:16px}.mds-margin-bottom-b4{margin-bottom:16px}.mds-padding-left-b4{padding-left:16px}.mds-margin-left-b4{margin-left:16px}.mds-padding-top-b5{padding-top:20px}.mds-margin-top-b5{margin-top:20px}.mds-padding-right-b5{padding-right:20px}.mds-margin-right-b5{margin-right:20px}.mds-padding-bottom-b5{padding-bottom:20px}.mds-margin-bottom-b5{margin-bottom:20px}.mds-padding-left-b5{padding-left:20px}.mds-margin-left-b5{margin-left:20px}.mds-padding-top-b6{padding-top:24px}.mds-margin-top-b6{margin-top:24px}.mds-padding-right-b6{padding-right:24px}.mds-margin-right-b6{margin-right:24px}.mds-padding-bottom-b6{padding-bottom:24px}.mds-margin-bottom-b6{margin-bottom:24px}.mds-padding-left-b6{padding-left:24px}.mds-margin-left-b6{margin-left:24px}.mds-padding-top-b7{padding-top:28px}.mds-margin-top-b7{margin-top:28px}.mds-padding-right-b7{padding-right:28px}.mds-margin-right-b7{margin-right:28px}.mds-padding-bottom-b7{padding-bottom:28px}.mds-margin-bottom-b7{margin-bottom:28px}.mds-padding-left-b7{padding-left:28px}.mds-margin-left-b7{margin-left:28px}.mds-padding-top-b8{padding-top:32px}.mds-margin-top-b8{margin-top:32px}.mds-padding-right-b8{padding-right:32px}.mds-margin-right-b8{margin-right:32px}.mds-padding-bottom-b8{padding-bottom:32px}.mds-margin-bottom-b8{margin-bottom:32px}.mds-padding-left-b8{padding-left:32px}.mds-margin-left-b8{margin-left:32px}.mds-padding-top-b9{padding-top:36px}.mds-margin-top-b9{margin-top:36px}.mds-padding-right-b9{padding-right:36px}.mds-margin-right-b9{margin-right:36px}.mds-padding-bottom-b9{padding-bottom:36px}.mds-margin-bottom-b9{margin-bottom:36px}.mds-padding-left-b9{padding-left:36px}.mds-margin-left-b9{margin-left:36px}.mds-padding-top-b10{padding-top:40px}.mds-margin-top-b10{margin-top:40px}.mds-padding-right-b10{padding-right:40px}.mds-margin-right-b10{margin-right:40px}.mds-padding-bottom-b10{padding-bottom:40px}.mds-margin-bottom-b10{margin-bottom:40px}.mds-padding-left-b10{padding-left:40px}.mds-margin-left-b10{margin-left:40px}@media (min-width: 25em){.mds-padding-top-sm-b0{padding-top:0px}.mds-margin-top-sm-b0{margin-top:0px}}@media (min-width: 37.5em){.mds-padding-top-md-b0{padding-top:0px}.mds-margin-top-md-b0{margin-top:0px}}@media (min-width: 63em){.mds-padding-top-lg-b0{padding-top:0px}.mds-margin-top-lg-b0{margin-top:0px}}@media (min-width: 80em){.mds-padding-top-xl-b0{padding-top:0px}.mds-margin-top-xl-b0{margin-top:0px}}@media (min-width: 25em){.mds-padding-right-sm-b0{padding-right:0px}.mds-margin-right-sm-b0{margin-right:0px}}@media (min-width: 37.5em){.mds-padding-right-md-b0{padding-right:0px}.mds-margin-right-md-b0{margin-right:0px}}@media (min-width: 63em){.mds-padding-right-lg-b0{padding-right:0px}.mds-margin-right-lg-b0{margin-right:0px}}@media (min-width: 80em){.mds-padding-right-xl-b0{padding-right:0px}.mds-margin-right-xl-b0{margin-right:0px}}@media (min-width: 25em){.mds-padding-bottom-sm-b0{padding-bottom:0px}.mds-margin-bottom-sm-b0{margin-bottom:0px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b0{padding-bottom:0px}.mds-margin-bottom-md-b0{margin-bottom:0px}}@media (min-width: 63em){.mds-padding-bottom-lg-b0{padding-bottom:0px}.mds-margin-bottom-lg-b0{margin-bottom:0px}}@media (min-width: 80em){.mds-padding-bottom-xl-b0{padding-bottom:0px}.mds-margin-bottom-xl-b0{margin-bottom:0px}}@media (min-width: 25em){.mds-padding-left-sm-b0{padding-left:0px}.mds-margin-left-sm-b0{margin-left:0px}}@media (min-width: 37.5em){.mds-padding-left-md-b0{padding-left:0px}.mds-margin-left-md-b0{margin-left:0px}}@media (min-width: 63em){.mds-padding-left-lg-b0{padding-left:0px}.mds-margin-left-lg-b0{margin-left:0px}}@media (min-width: 80em){.mds-padding-left-xl-b0{padding-left:0px}.mds-margin-left-xl-b0{margin-left:0px}}@media (min-width: 25em){.mds-padding-top-sm-b1{padding-top:4px}.mds-margin-top-sm-b1{margin-top:4px}}@media (min-width: 37.5em){.mds-padding-top-md-b1{padding-top:4px}.mds-margin-top-md-b1{margin-top:4px}}@media (min-width: 63em){.mds-padding-top-lg-b1{padding-top:4px}.mds-margin-top-lg-b1{margin-top:4px}}@media (min-width: 80em){.mds-padding-top-xl-b1{padding-top:4px}.mds-margin-top-xl-b1{margin-top:4px}}@media (min-width: 25em){.mds-padding-right-sm-b1{padding-right:4px}.mds-margin-right-sm-b1{margin-right:4px}}@media (min-width: 37.5em){.mds-padding-right-md-b1{padding-right:4px}.mds-margin-right-md-b1{margin-right:4px}}@media (min-width: 63em){.mds-padding-right-lg-b1{padding-right:4px}.mds-margin-right-lg-b1{margin-right:4px}}@media (min-width: 80em){.mds-padding-right-xl-b1{padding-right:4px}.mds-margin-right-xl-b1{margin-right:4px}}@media (min-width: 25em){.mds-padding-bottom-sm-b1{padding-bottom:4px}.mds-margin-bottom-sm-b1{margin-bottom:4px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b1{padding-bottom:4px}.mds-margin-bottom-md-b1{margin-bottom:4px}}@media (min-width: 63em){.mds-padding-bottom-lg-b1{padding-bottom:4px}.mds-margin-bottom-lg-b1{margin-bottom:4px}}@media (min-width: 80em){.mds-padding-bottom-xl-b1{padding-bottom:4px}.mds-margin-bottom-xl-b1{margin-bottom:4px}}@media (min-width: 25em){.mds-padding-left-sm-b1{padding-left:4px}.mds-margin-left-sm-b1{margin-left:4px}}@media (min-width: 37.5em){.mds-padding-left-md-b1{padding-left:4px}.mds-margin-left-md-b1{margin-left:4px}}@media (min-width: 63em){.mds-padding-left-lg-b1{padding-left:4px}.mds-margin-left-lg-b1{margin-left:4px}}@media (min-width: 80em){.mds-padding-left-xl-b1{padding-left:4px}.mds-margin-left-xl-b1{margin-left:4px}}@media (min-width: 25em){.mds-padding-top-sm-b2{padding-top:8px}.mds-margin-top-sm-b2{margin-top:8px}}@media (min-width: 37.5em){.mds-padding-top-md-b2{padding-top:8px}.mds-margin-top-md-b2{margin-top:8px}}@media (min-width: 63em){.mds-padding-top-lg-b2{padding-top:8px}.mds-margin-top-lg-b2{margin-top:8px}}@media (min-width: 80em){.mds-padding-top-xl-b2{padding-top:8px}.mds-margin-top-xl-b2{margin-top:8px}}@media (min-width: 25em){.mds-padding-right-sm-b2{padding-right:8px}.mds-margin-right-sm-b2{margin-right:8px}}@media (min-width: 37.5em){.mds-padding-right-md-b2{padding-right:8px}.mds-margin-right-md-b2{margin-right:8px}}@media (min-width: 63em){.mds-padding-right-lg-b2{padding-right:8px}.mds-margin-right-lg-b2{margin-right:8px}}@media (min-width: 80em){.mds-padding-right-xl-b2{padding-right:8px}.mds-margin-right-xl-b2{margin-right:8px}}@media (min-width: 25em){.mds-padding-bottom-sm-b2{padding-bottom:8px}.mds-margin-bottom-sm-b2{margin-bottom:8px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b2{padding-bottom:8px}.mds-margin-bottom-md-b2{margin-bottom:8px}}@media (min-width: 63em){.mds-padding-bottom-lg-b2{padding-bottom:8px}.mds-margin-bottom-lg-b2{margin-bottom:8px}}@media (min-width: 80em){.mds-padding-bottom-xl-b2{padding-bottom:8px}.mds-margin-bottom-xl-b2{margin-bottom:8px}}@media (min-width: 25em){.mds-padding-left-sm-b2{padding-left:8px}.mds-margin-left-sm-b2{margin-left:8px}}@media (min-width: 37.5em){.mds-padding-left-md-b2{padding-left:8px}.mds-margin-left-md-b2{margin-left:8px}}@media (min-width: 63em){.mds-padding-left-lg-b2{padding-left:8px}.mds-margin-left-lg-b2{margin-left:8px}}@media (min-width: 80em){.mds-padding-left-xl-b2{padding-left:8px}.mds-margin-left-xl-b2{margin-left:8px}}@media (min-width: 25em){.mds-padding-top-sm-b3{padding-top:12px}.mds-margin-top-sm-b3{margin-top:12px}}@media (min-width: 37.5em){.mds-padding-top-md-b3{padding-top:12px}.mds-margin-top-md-b3{margin-top:12px}}@media (min-width: 63em){.mds-padding-top-lg-b3{padding-top:12px}.mds-margin-top-lg-b3{margin-top:12px}}@media (min-width: 80em){.mds-padding-top-xl-b3{padding-top:12px}.mds-margin-top-xl-b3{margin-top:12px}}@media (min-width: 25em){.mds-padding-right-sm-b3{padding-right:12px}.mds-margin-right-sm-b3{margin-right:12px}}@media (min-width: 37.5em){.mds-padding-right-md-b3{padding-right:12px}.mds-margin-right-md-b3{margin-right:12px}}@media (min-width: 63em){.mds-padding-right-lg-b3{padding-right:12px}.mds-margin-right-lg-b3{margin-right:12px}}@media (min-width: 80em){.mds-padding-right-xl-b3{padding-right:12px}.mds-margin-right-xl-b3{margin-right:12px}}@media (min-width: 25em){.mds-padding-bottom-sm-b3{padding-bottom:12px}.mds-margin-bottom-sm-b3{margin-bottom:12px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b3{padding-bottom:12px}.mds-margin-bottom-md-b3{margin-bottom:12px}}@media (min-width: 63em){.mds-padding-bottom-lg-b3{padding-bottom:12px}.mds-margin-bottom-lg-b3{margin-bottom:12px}}@media (min-width: 80em){.mds-padding-bottom-xl-b3{padding-bottom:12px}.mds-margin-bottom-xl-b3{margin-bottom:12px}}@media (min-width: 25em){.mds-padding-left-sm-b3{padding-left:12px}.mds-margin-left-sm-b3{margin-left:12px}}@media (min-width: 37.5em){.mds-padding-left-md-b3{padding-left:12px}.mds-margin-left-md-b3{margin-left:12px}}@media (min-width: 63em){.mds-padding-left-lg-b3{padding-left:12px}.mds-margin-left-lg-b3{margin-left:12px}}@media (min-width: 80em){.mds-padding-left-xl-b3{padding-left:12px}.mds-margin-left-xl-b3{margin-left:12px}}@media (min-width: 25em){.mds-padding-top-sm-b4{padding-top:16px}.mds-margin-top-sm-b4{margin-top:16px}}@media (min-width: 37.5em){.mds-padding-top-md-b4{padding-top:16px}.mds-margin-top-md-b4{margin-top:16px}}@media (min-width: 63em){.mds-padding-top-lg-b4{padding-top:16px}.mds-margin-top-lg-b4{margin-top:16px}}@media (min-width: 80em){.mds-padding-top-xl-b4{padding-top:16px}.mds-margin-top-xl-b4{margin-top:16px}}@media (min-width: 25em){.mds-padding-right-sm-b4{padding-right:16px}.mds-margin-right-sm-b4{margin-right:16px}}@media (min-width: 37.5em){.mds-padding-right-md-b4{padding-right:16px}.mds-margin-right-md-b4{margin-right:16px}}@media (min-width: 63em){.mds-padding-right-lg-b4{padding-right:16px}.mds-margin-right-lg-b4{margin-right:16px}}@media (min-width: 80em){.mds-padding-right-xl-b4{padding-right:16px}.mds-margin-right-xl-b4{margin-right:16px}}@media (min-width: 25em){.mds-padding-bottom-sm-b4{padding-bottom:16px}.mds-margin-bottom-sm-b4{margin-bottom:16px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b4{padding-bottom:16px}.mds-margin-bottom-md-b4{margin-bottom:16px}}@media (min-width: 63em){.mds-padding-bottom-lg-b4{padding-bottom:16px}.mds-margin-bottom-lg-b4{margin-bottom:16px}}@media (min-width: 80em){.mds-padding-bottom-xl-b4{padding-bottom:16px}.mds-margin-bottom-xl-b4{margin-bottom:16px}}@media (min-width: 25em){.mds-padding-left-sm-b4{padding-left:16px}.mds-margin-left-sm-b4{margin-left:16px}}@media (min-width: 37.5em){.mds-padding-left-md-b4{padding-left:16px}.mds-margin-left-md-b4{margin-left:16px}}@media (min-width: 63em){.mds-padding-left-lg-b4{padding-left:16px}.mds-margin-left-lg-b4{margin-left:16px}}@media (min-width: 80em){.mds-padding-left-xl-b4{padding-left:16px}.mds-margin-left-xl-b4{margin-left:16px}}@media (min-width: 25em){.mds-padding-top-sm-b5{padding-top:20px}.mds-margin-top-sm-b5{margin-top:20px}}@media (min-width: 37.5em){.mds-padding-top-md-b5{padding-top:20px}.mds-margin-top-md-b5{margin-top:20px}}@media (min-width: 63em){.mds-padding-top-lg-b5{padding-top:20px}.mds-margin-top-lg-b5{margin-top:20px}}@media (min-width: 80em){.mds-padding-top-xl-b5{padding-top:20px}.mds-margin-top-xl-b5{margin-top:20px}}@media (min-width: 25em){.mds-padding-right-sm-b5{padding-right:20px}.mds-margin-right-sm-b5{margin-right:20px}}@media (min-width: 37.5em){.mds-padding-right-md-b5{padding-right:20px}.mds-margin-right-md-b5{margin-right:20px}}@media (min-width: 63em){.mds-padding-right-lg-b5{padding-right:20px}.mds-margin-right-lg-b5{margin-right:20px}}@media (min-width: 80em){.mds-padding-right-xl-b5{padding-right:20px}.mds-margin-right-xl-b5{margin-right:20px}}@media (min-width: 25em){.mds-padding-bottom-sm-b5{padding-bottom:20px}.mds-margin-bottom-sm-b5{margin-bottom:20px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b5{padding-bottom:20px}.mds-margin-bottom-md-b5{margin-bottom:20px}}@media (min-width: 63em){.mds-padding-bottom-lg-b5{padding-bottom:20px}.mds-margin-bottom-lg-b5{margin-bottom:20px}}@media (min-width: 80em){.mds-padding-bottom-xl-b5{padding-bottom:20px}.mds-margin-bottom-xl-b5{margin-bottom:20px}}@media (min-width: 25em){.mds-padding-left-sm-b5{padding-left:20px}.mds-margin-left-sm-b5{margin-left:20px}}@media (min-width: 37.5em){.mds-padding-left-md-b5{padding-left:20px}.mds-margin-left-md-b5{margin-left:20px}}@media (min-width: 63em){.mds-padding-left-lg-b5{padding-left:20px}.mds-margin-left-lg-b5{margin-left:20px}}@media (min-width: 80em){.mds-padding-left-xl-b5{padding-left:20px}.mds-margin-left-xl-b5{margin-left:20px}}@media (min-width: 25em){.mds-padding-top-sm-b6{padding-top:24px}.mds-margin-top-sm-b6{margin-top:24px}}@media (min-width: 37.5em){.mds-padding-top-md-b6{padding-top:24px}.mds-margin-top-md-b6{margin-top:24px}}@media (min-width: 63em){.mds-padding-top-lg-b6{padding-top:24px}.mds-margin-top-lg-b6{margin-top:24px}}@media (min-width: 80em){.mds-padding-top-xl-b6{padding-top:24px}.mds-margin-top-xl-b6{margin-top:24px}}@media (min-width: 25em){.mds-padding-right-sm-b6{padding-right:24px}.mds-margin-right-sm-b6{margin-right:24px}}@media (min-width: 37.5em){.mds-padding-right-md-b6{padding-right:24px}.mds-margin-right-md-b6{margin-right:24px}}@media (min-width: 63em){.mds-padding-right-lg-b6{padding-right:24px}.mds-margin-right-lg-b6{margin-right:24px}}@media (min-width: 80em){.mds-padding-right-xl-b6{padding-right:24px}.mds-margin-right-xl-b6{margin-right:24px}}@media (min-width: 25em){.mds-padding-bottom-sm-b6{padding-bottom:24px}.mds-margin-bottom-sm-b6{margin-bottom:24px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b6{padding-bottom:24px}.mds-margin-bottom-md-b6{margin-bottom:24px}}@media (min-width: 63em){.mds-padding-bottom-lg-b6{padding-bottom:24px}.mds-margin-bottom-lg-b6{margin-bottom:24px}}@media (min-width: 80em){.mds-padding-bottom-xl-b6{padding-bottom:24px}.mds-margin-bottom-xl-b6{margin-bottom:24px}}@media (min-width: 25em){.mds-padding-left-sm-b6{padding-left:24px}.mds-margin-left-sm-b6{margin-left:24px}}@media (min-width: 37.5em){.mds-padding-left-md-b6{padding-left:24px}.mds-margin-left-md-b6{margin-left:24px}}@media (min-width: 63em){.mds-padding-left-lg-b6{padding-left:24px}.mds-margin-left-lg-b6{margin-left:24px}}@media (min-width: 80em){.mds-padding-left-xl-b6{padding-left:24px}.mds-margin-left-xl-b6{margin-left:24px}}@media (min-width: 25em){.mds-padding-top-sm-b7{padding-top:28px}.mds-margin-top-sm-b7{margin-top:28px}}@media (min-width: 37.5em){.mds-padding-top-md-b7{padding-top:28px}.mds-margin-top-md-b7{margin-top:28px}}@media (min-width: 63em){.mds-padding-top-lg-b7{padding-top:28px}.mds-margin-top-lg-b7{margin-top:28px}}@media (min-width: 80em){.mds-padding-top-xl-b7{padding-top:28px}.mds-margin-top-xl-b7{margin-top:28px}}@media (min-width: 25em){.mds-padding-right-sm-b7{padding-right:28px}.mds-margin-right-sm-b7{margin-right:28px}}@media (min-width: 37.5em){.mds-padding-right-md-b7{padding-right:28px}.mds-margin-right-md-b7{margin-right:28px}}@media (min-width: 63em){.mds-padding-right-lg-b7{padding-right:28px}.mds-margin-right-lg-b7{margin-right:28px}}@media (min-width: 80em){.mds-padding-right-xl-b7{padding-right:28px}.mds-margin-right-xl-b7{margin-right:28px}}@media (min-width: 25em){.mds-padding-bottom-sm-b7{padding-bottom:28px}.mds-margin-bottom-sm-b7{margin-bottom:28px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b7{padding-bottom:28px}.mds-margin-bottom-md-b7{margin-bottom:28px}}@media (min-width: 63em){.mds-padding-bottom-lg-b7{padding-bottom:28px}.mds-margin-bottom-lg-b7{margin-bottom:28px}}@media (min-width: 80em){.mds-padding-bottom-xl-b7{padding-bottom:28px}.mds-margin-bottom-xl-b7{margin-bottom:28px}}@media (min-width: 25em){.mds-padding-left-sm-b7{padding-left:28px}.mds-margin-left-sm-b7{margin-left:28px}}@media (min-width: 37.5em){.mds-padding-left-md-b7{padding-left:28px}.mds-margin-left-md-b7{margin-left:28px}}@media (min-width: 63em){.mds-padding-left-lg-b7{padding-left:28px}.mds-margin-left-lg-b7{margin-left:28px}}@media (min-width: 80em){.mds-padding-left-xl-b7{padding-left:28px}.mds-margin-left-xl-b7{margin-left:28px}}@media (min-width: 25em){.mds-padding-top-sm-b8{padding-top:32px}.mds-margin-top-sm-b8{margin-top:32px}}@media (min-width: 37.5em){.mds-padding-top-md-b8{padding-top:32px}.mds-margin-top-md-b8{margin-top:32px}}@media (min-width: 63em){.mds-padding-top-lg-b8{padding-top:32px}.mds-margin-top-lg-b8{margin-top:32px}}@media (min-width: 80em){.mds-padding-top-xl-b8{padding-top:32px}.mds-margin-top-xl-b8{margin-top:32px}}@media (min-width: 25em){.mds-padding-right-sm-b8{padding-right:32px}.mds-margin-right-sm-b8{margin-right:32px}}@media (min-width: 37.5em){.mds-padding-right-md-b8{padding-right:32px}.mds-margin-right-md-b8{margin-right:32px}}@media (min-width: 63em){.mds-padding-right-lg-b8{padding-right:32px}.mds-margin-right-lg-b8{margin-right:32px}}@media (min-width: 80em){.mds-padding-right-xl-b8{padding-right:32px}.mds-margin-right-xl-b8{margin-right:32px}}@media (min-width: 25em){.mds-padding-bottom-sm-b8{padding-bottom:32px}.mds-margin-bottom-sm-b8{margin-bottom:32px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b8{padding-bottom:32px}.mds-margin-bottom-md-b8{margin-bottom:32px}}@media (min-width: 63em){.mds-padding-bottom-lg-b8{padding-bottom:32px}.mds-margin-bottom-lg-b8{margin-bottom:32px}}@media (min-width: 80em){.mds-padding-bottom-xl-b8{padding-bottom:32px}.mds-margin-bottom-xl-b8{margin-bottom:32px}}@media (min-width: 25em){.mds-padding-left-sm-b8{padding-left:32px}.mds-margin-left-sm-b8{margin-left:32px}}@media (min-width: 37.5em){.mds-padding-left-md-b8{padding-left:32px}.mds-margin-left-md-b8{margin-left:32px}}@media (min-width: 63em){.mds-padding-left-lg-b8{padding-left:32px}.mds-margin-left-lg-b8{margin-left:32px}}@media (min-width: 80em){.mds-padding-left-xl-b8{padding-left:32px}.mds-margin-left-xl-b8{margin-left:32px}}@media (min-width: 25em){.mds-padding-top-sm-b9{padding-top:36px}.mds-margin-top-sm-b9{margin-top:36px}}@media (min-width: 37.5em){.mds-padding-top-md-b9{padding-top:36px}.mds-margin-top-md-b9{margin-top:36px}}@media (min-width: 63em){.mds-padding-top-lg-b9{padding-top:36px}.mds-margin-top-lg-b9{margin-top:36px}}@media (min-width: 80em){.mds-padding-top-xl-b9{padding-top:36px}.mds-margin-top-xl-b9{margin-top:36px}}@media (min-width: 25em){.mds-padding-right-sm-b9{padding-right:36px}.mds-margin-right-sm-b9{margin-right:36px}}@media (min-width: 37.5em){.mds-padding-right-md-b9{padding-right:36px}.mds-margin-right-md-b9{margin-right:36px}}@media (min-width: 63em){.mds-padding-right-lg-b9{padding-right:36px}.mds-margin-right-lg-b9{margin-right:36px}}@media (min-width: 80em){.mds-padding-right-xl-b9{padding-right:36px}.mds-margin-right-xl-b9{margin-right:36px}}@media (min-width: 25em){.mds-padding-bottom-sm-b9{padding-bottom:36px}.mds-margin-bottom-sm-b9{margin-bottom:36px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b9{padding-bottom:36px}.mds-margin-bottom-md-b9{margin-bottom:36px}}@media (min-width: 63em){.mds-padding-bottom-lg-b9{padding-bottom:36px}.mds-margin-bottom-lg-b9{margin-bottom:36px}}@media (min-width: 80em){.mds-padding-bottom-xl-b9{padding-bottom:36px}.mds-margin-bottom-xl-b9{margin-bottom:36px}}@media (min-width: 25em){.mds-padding-left-sm-b9{padding-left:36px}.mds-margin-left-sm-b9{margin-left:36px}}@media (min-width: 37.5em){.mds-padding-left-md-b9{padding-left:36px}.mds-margin-left-md-b9{margin-left:36px}}@media (min-width: 63em){.mds-padding-left-lg-b9{padding-left:36px}.mds-margin-left-lg-b9{margin-left:36px}}@media (min-width: 80em){.mds-padding-left-xl-b9{padding-left:36px}.mds-margin-left-xl-b9{margin-left:36px}}@media (min-width: 25em){.mds-padding-top-sm-b10{padding-top:40px}.mds-margin-top-sm-b10{margin-top:40px}}@media (min-width: 37.5em){.mds-padding-top-md-b10{padding-top:40px}.mds-margin-top-md-b10{margin-top:40px}}@media (min-width: 63em){.mds-padding-top-lg-b10{padding-top:40px}.mds-margin-top-lg-b10{margin-top:40px}}@media (min-width: 80em){.mds-padding-top-xl-b10{padding-top:40px}.mds-margin-top-xl-b10{margin-top:40px}}@media (min-width: 25em){.mds-padding-right-sm-b10{padding-right:40px}.mds-margin-right-sm-b10{margin-right:40px}}@media (min-width: 37.5em){.mds-padding-right-md-b10{padding-right:40px}.mds-margin-right-md-b10{margin-right:40px}}@media (min-width: 63em){.mds-padding-right-lg-b10{padding-right:40px}.mds-margin-right-lg-b10{margin-right:40px}}@media (min-width: 80em){.mds-padding-right-xl-b10{padding-right:40px}.mds-margin-right-xl-b10{margin-right:40px}}@media (min-width: 25em){.mds-padding-bottom-sm-b10{padding-bottom:40px}.mds-margin-bottom-sm-b10{margin-bottom:40px}}@media (min-width: 37.5em){.mds-padding-bottom-md-b10{padding-bottom:40px}.mds-margin-bottom-md-b10{margin-bottom:40px}}@media (min-width: 63em){.mds-padding-bottom-lg-b10{padding-bottom:40px}.mds-margin-bottom-lg-b10{margin-bottom:40px}}@media (min-width: 80em){.mds-padding-bottom-xl-b10{padding-bottom:40px}.mds-margin-bottom-xl-b10{margin-bottom:40px}}@media (min-width: 25em){.mds-padding-left-sm-b10{padding-left:40px}.mds-margin-left-sm-b10{margin-left:40px}}@media (min-width: 37.5em){.mds-padding-left-md-b10{padding-left:40px}.mds-margin-left-md-b10{margin-left:40px}}@media (min-width: 63em){.mds-padding-left-lg-b10{padding-left:40px}.mds-margin-left-lg-b10{margin-left:40px}}@media (min-width: 80em){.mds-padding-left-xl-b10{padding-left:40px}.mds-margin-left-xl-b10{margin-left:40px}}.mds-float-left{float:left}.mds-float-right{float:right}.mds-float-none{float:none}@media (min-width: 25em){.mds-float-sm-left{float:left}.mds-float-sm-right{float:right}.mds-float-sm-none{float:none}}@media (min-width: 37.5em){.mds-float-md-left{float:left}.mds-float-md-right{float:right}.mds-float-md-none{float:none}}@media (min-width: 63em){.mds-float-lg-left{float:left}.mds-float-lg-right{float:right}.mds-float-lg-none{float:none}}@media (min-width: 80em){.mds-float-xl-left{float:left}.mds-float-xl-right{float:right}.mds-float-xl-none{float:none}}.mds-text-align-left{text-align:left}.mds-text-align-right{text-align:right}.mds-text-align-center{text-align:center}@media (min-width: 25em){.mds-text-align-sm-left{text-align:left}.mds-text-align-sm-right{text-align:right}.mds-text-align-sm-center{text-align:center}}@media (min-width: 37.5em){.mds-text-align-md-left{text-align:left}.mds-text-align-md-right{text-align:right}.mds-text-align-md-center{text-align:center}}@media (min-width: 63em){.mds-text-align-lg-left{text-align:left}.mds-text-align-lg-right{text-align:right}.mds-text-align-lg-center{text-align:center}}@media (min-width: 80em){.mds-text-align-xl-left{text-align:left}.mds-text-align-xl-right{text-align:right}.mds-text-align-xl-center{text-align:center}}.mds-display-block{display:block}.mds-display-inline{display:inline}.mds-display-inline-block{display:inline-block}.mds-display-none{display:none}@media (min-width: 25em){.mds-display-sm-block{display:block}.mds-display-sm-inline{display:inline}.mds-display-sm-inline-block{display:inline-block}.mds-display-sm-none{display:none}}@media (min-width: 37.5em){.mds-display-md-block{display:block}.mds-display-md-inline{display:inline}.mds-display-md-inline-block{display:inline-block}.mds-display-md-none{display:none}}@media (min-width: 63em){.mds-display-lg-block{display:block}.mds-display-lg-inline{display:inline}.mds-display-lg-inline-block{display:inline-block}.mds-display-lg-none{display:none}}@media (min-width: 80em){.mds-display-xl-block{display:block}.mds-display-xl-inline{display:inline}.mds-display-xl-inline-block{display:inline-block}.mds-display-xl-none{display:none}}.mds-border,.mds-surface,.mds-message{border:1px solid #ddd}.mds-border-none{border:0}@media (min-width: 25em){.mds-border-sm{border:1px solid #ddd}}@media (min-width: 37.5em){.mds-border-md{border:1px solid #ddd}}@media (min-width: 63em){.mds-border-lg{border:1px solid #ddd}}@media (min-width: 80em){.mds-border-xl{border:1px solid #ddd}}@media (min-width: 25em){.mds-border-sm-none{border:0}}@media (min-width: 37.5em){.mds-border-md-none{border:0}}@media (min-width: 63em){.mds-border-lg-none{border:0}}@media (min-width: 80em){.mds-border-xl-none{border:0}}.mds-border-top{border-top:1px solid #ddd}.mds-border-right{border-right:1px solid #ddd}.mds-border-bottom,.mds-tabs__list{border-bottom:1px solid #ddd}.mds-border-left{border-left:1px solid #ddd}.mds-border-top-none{border-top:0}.mds-border-right-none{border-right:0}.mds-border-bottom-none{border-bottom:0}.mds-border-left-none{border-left:0}@media (min-width: 25em){.mds-border-sm-top{border-top:1px solid #ddd}.mds-border-sm-right{border-right:1px solid #ddd}.mds-border-sm-bottom{border-bottom:1px solid #ddd}.mds-border-sm-left{border-left:1px solid #ddd}}@media (min-width: 37.5em){.mds-border-md-top{border-top:1px solid #ddd}.mds-border-md-right{border-right:1px solid #ddd}.mds-border-md-bottom{border-bottom:1px solid #ddd}.mds-border-md-left{border-left:1px solid #ddd}}@media (min-width: 63em){.mds-border-lg-top{border-top:1px solid #ddd}.mds-border-lg-right{border-right:1px solid #ddd}.mds-border-lg-bottom{border-bottom:1px solid #ddd}.mds-border-lg-left{border-left:1px solid #ddd}}@media (min-width: 80em){.mds-border-xl-top{border-top:1px solid #ddd}.mds-border-xl-right{border-right:1px solid #ddd}.mds-border-xl-bottom{border-bottom:1px solid #ddd}.mds-border-xl-left{border-left:1px solid #ddd}}@media (min-width: 25em){.mds-border-sm-top-none{border-top:0}.mds-border-sm-right-none{border-right:0}.mds-border-sm-bottom-none{border-bottom:0}.mds-border-sm-left-none{border-left:0}}@media (min-width: 37.5em){.mds-border-md-top-none{border-top:0}.mds-border-md-right-none{border-right:0}.mds-border-md-bottom-none{border-bottom:0}.mds-border-md-left-none{border-left:0}}@media (min-width: 63em){.mds-border-lg-top-none{border-top:0}.mds-border-lg-right-none{border-right:0}.mds-border-lg-bottom-none{border-bottom:0}.mds-border-lg-left-none{border-left:0}}@media (min-width: 80em){.mds-border-xl-top-none{border-top:0}.mds-border-xl-right-none{border-right:0}.mds-border-xl-bottom-none{border-bottom:0}.mds-border-xl-left-none{border-left:0}}.mds-border-radius,.mds-surface,.mds-message{border-radius:4px}.mds-border-radius-none{border-radius:0}.mds-edited-text ul,.mds-edited-text ol{margin:0 0 20px 12px;padding:0;list-style-position:outside}.mds-edited-text ul ul,.mds-edited-text ul ol,.mds-edited-text ol ul,.mds-edited-text ol ol{margin:8px 0 0 0}.mds-edited-text ul{list-style-type:disc}.mds-edited-text ol{list-style-type:decimal}.mds-edited-text li{margin-bottom:4px;margin-left:16px}.mds-edited-text.mds-font-body-copy-bulk p,.mds-font-body-copy-bulk .mds-edited-text p,.mds-edited-text .mds-font-body-copy-bulk p{margin-bottom:16px}.mds-width-full{width:100%}.mds-width-auto{width:auto}@media (min-width: 25em){.mds-width-sm-full{width:100%}.mds-width-sm-auto{width:auto}}@media (min-width: 37.5em){.mds-width-md-full{width:100%}.mds-width-md-auto{width:auto}}@media (min-width: 63em){.mds-width-lg-full{width:100%}.mds-width-lg-auto{width:auto}}@media (min-width: 80em){.mds-width-xl-full{width:100%}.mds-width-xl-auto{width:auto}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@madgex/design-system",
-  "version": "1.22.4",
+  "version": "1.23.1",
   "scripts": {
     "clean": "rimraf dist public tokens/build",
     "commit": "commit",

package/src/layout/containers/README.md

@@ -5,4 +5,10 @@ Class `mds-site-container` should be added right after the body, it contains all
 
 `mds-surface` will add a block with a white background, border and and border-radius. Add `mds-surface__inner` inside it to get the padding.
 
-To add a `position: fixed` container, use `mds-fixed-container`. By default it will be fixed at the bottom. Use `mds-fixed-container--top` to fix it at the top.
+To add a `position: fixed` container, use `mds-fixed-container`. By default it will be fixed at the bottom. Use `mds-fixed-container--top` to fix it at the top.
+
+To add a `position: sticky` to the container, use the modifier `mds-fixed-container--sticky`.
+
+When placed inside a `mds-wrapper` block, the container will stretch automatically to the full width of the container by default and will go back to be within the wrapper constraints from 600px.
+
+*Note: We don't currently use the sticky block inside a wrapper block at tablet/desktop size so it may have to be reviewed when we do.*

package/src/layout/containers/containers.njk

@@ -1,16 +1,16 @@
 <div class="mds-site-container container-example" style="margin: 80px 0;">
   <div class="mds-wrapper">
-    <div class="content-example">
-      <div class="mds-surface">
-        <div class="mds-surface__inner">
-          <h2>Content inside the site-container and wrapper</h2>
-          <p>site-container is 100%</p>
-          <p>wrapper is 100% - 20px (gutter width) and max-width 1280px (1.5% left and right padding)</p>
-        </div>
+    <div class="mds-surface mds-margin-bottom-b5">
+      <div class="mds-surface__inner">
+        <h2>Content inside the site-container and wrapper</h2>
+        <p>site-container is 100%</p>
+        <p>wrapper is 100% - 20px (gutter width) and max-width 1280px (1.5% left and right padding)</p>
+        <div style="height: 100px;"></div>
       </div>
     </div>
+    <div class="mds-fixed-container mds-fixed-container--sticky mds-padding-b5 mds-text-align-center">This is a sticky container</div>
   </div>
 </div>
 
-<div class="mds-fixed-container mds-padding-b5 mds-text-align-center">This a fixed container at the bottom</div>
-<div class="mds-fixed-container mds-fixed-container--top  mds-padding-b5 mds-text-align-center">This a fixed container at the top</div>
+{# <div class="mds-fixed-container mds-padding-b5 mds-text-align-center">This a fixed container at the bottom</div> #}
+<div class="mds-fixed-container mds-fixed-container--top mds-padding-b5 mds-text-align-center">This a fixed container at the top</div>

package/src/scss/core/_containers.scss

@@ -47,3 +47,22 @@ body {
     top: 0;
   }
 }
+
+$mds-half-gutter-width: $mds-size-gutter-width * 0.5;
+
+.mds-fixed-container--sticky {
+  position: sticky;
+
+  // I added 0.01 to stretch the container slightly more to avoid a tiny gap between the edge of the screen and the container
+  .mds-wrapper & {
+    width: calc(100% + #{($mds-size-wrapper-padding + 0.01) * 2} + #{$mds-size-gutter-width});
+    margin-left: calc((#{$mds-size-wrapper-padding + 0.01} + #{$mds-half-gutter-width}) * -1);
+    margin-right: calc((#{$mds-size-wrapper-padding + 0.01} + #{$mds-half-gutter-width}) * -1);
+
+    @include mq($from: $mds-size-breakpoint-md) {
+      width: 100%;
+      margin-left: auto;
+      margin-right: auto;
+    }
+  }
+}

package/src/scss/index.scss

@@ -1,3 +1,3 @@
-@import '_tokens/scss/tokens';
+@import '../../dist/_tokens/scss/tokens';
 
 @import './import.scss';