@import url(https://fonts.googleapis.com/css2?family=Karla:wght@400;700&display=swap);
body{color:#333;font-family:Karla,sans-serif;font-size:14px;line-height:1.5;margin:0;padding:0}@media (min-width:600px){body{font-size:16px}}@media (min-width:900px){body{font-size:18px}}@media (min-width:1200px){body{font-size:20px}}@media (min-width:1800px){body{font-size:24px}}h1,h2,h3,h4,h5,h6{color:#111;font-family:Karla,sans-serif;line-height:1.2;margin-bottom:.5em;margin-top:0;width:100%}@media (min-width:0px){h1{font-size:28px}h2{font-size:24px}h3{font-size:20px}h4{font-size:18px}h5{font-size:16px}h6{font-size:14px}}@media (min-width:600px){h1{font-size:32px}h2{font-size:28px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}}@media (min-width:900px){h1{font-size:36px}h2{font-size:32px}h3{font-size:28px}h4{font-size:24px}h5{font-size:20px}h6{font-size:18px}}@media (min-width:1200px){h1{font-size:40px}h2{font-size:36px}h3{font-size:32px}h4{font-size:28px}h5{font-size:24px}h6{font-size:20px}}@media (min-width:1800px){h1{font-size:48px}h2{font-size:40px}h3{font-size:36px}h4{font-size:32px}h5{font-size:28px}h6{font-size:24px}}p{margin-bottom:1em;margin-top:0}a{color:#007bff;text-decoration:none}a:focus,a:hover{color:#0062cc;text-decoration:underline}ol,ul{margin-bottom:1em;margin-top:0;padding-left:1.5em}ul{list-style-type:disc}ol{list-style-type:decimal}li{margin-bottom:.5em}blockquote{background-color:#e6f2ff;border-left:5px solid #007bff;color:#004a99;margin:0 0 1em;padding:.5em 1em}.text-center{text-align:center}.text-right{text-align:right}.text-left{text-align:left}.text-uppercase{text-transform:uppercase}.text-lowercase{text-transform:lowercase}.text-capitalize{text-transform:capitalize}.font-weight-bold{font-weight:700}.font-weight-normal{font-weight:400}.font-italic{font-style:italic}.grid{display:grid;gap:32px;grid-template-columns:repeat(auto-fit,minmax(0,1fr));width:100%}.demo-section,.grid-container{margin:0 auto}@media (min-width:0){.demo-section,.grid-container{padding-left:16px;padding-right:16px;width:calc(95% - 32px)}}@media (min-width:640px){.demo-section,.grid-container{max-width:592px;padding-left:24px;padding-right:24px;width:calc(100% - 48px)}}@media (min-width:1024px){.demo-section,.grid-container{max-width:960px;padding-left:32px;padding-right:32px;width:calc(100% - 64px)}}@media (min-width:1200px){.demo-section,.grid-container{max-width:1104px;padding-left:48px;padding-right:48px;width:calc(100% - 96px)}}@media (min-width:1440px){.demo-section,.grid-container{max-width:1312px;padding-left:64px;padding-right:64px;width:calc(100% - 128px)}}.demo-section-full-width,.grid-container-full-width{margin:0 auto}@media (min-width:0){.demo-section-full-width,.grid-container-full-width{max-width:calc(95% - 32px);padding-left:16px;padding-right:16px;width:calc(95% - 32px)}}@media (min-width:640px){.demo-section-full-width,.grid-container-full-width{max-width:calc(100% - 48px);padding-left:24px;padding-right:24px;width:calc(100% - 48px)}}@media (min-width:1024px){.demo-section-full-width,.grid-container-full-width{max-width:calc(100% - 64px);padding-left:32px;padding-right:32px;width:calc(100% - 64px)}}@media (min-width:1200px){.demo-section-full-width,.grid-container-full-width{max-width:calc(100% - 96px);padding-left:48px;padding-right:48px;width:calc(100% - 96px)}}@media (min-width:1440px){.demo-section-full-width,.grid-container-full-width{max-width:calc(100% - 128px);padding-left:64px;padding-right:64px;width:calc(100% - 128px)}}@media (min-width:0){.grid-cols-xsmall-1{display:grid;gap:32px;grid-template-columns:repeat(1,minmax(0,1fr));width:100%}.grid-cols-xsmall-2{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.grid-cols-xsmall-3{display:grid;gap:32px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.grid-cols-xsmall-4{display:grid;gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.grid-cols-xsmall-5{display:grid;gap:32px;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.grid-cols-xsmall-6{display:grid;gap:32px;grid-template-columns:repeat(6,minmax(0,1fr));width:100%}.grid-cols-xsmall-7{display:grid;gap:32px;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}.grid-cols-xsmall-8{display:grid;gap:32px;grid-template-columns:repeat(8,minmax(0,1fr));width:100%}.grid-cols-xsmall-9{display:grid;gap:32px;grid-template-columns:repeat(9,minmax(0,1fr));width:100%}.grid-cols-xsmall-10{display:grid;gap:32px;grid-template-columns:repeat(10,minmax(0,1fr));width:100%}.grid-cols-xsmall-11{display:grid;gap:32px;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}.grid-cols-xsmall-12{display:grid;gap:32px;grid-template-columns:repeat(12,minmax(0,1fr));width:100%}}@media (min-width:640px){.grid-cols-small-1{display:grid;gap:32px;grid-template-columns:repeat(1,minmax(0,1fr));width:100%}.grid-cols-small-2{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.grid-cols-small-3{display:grid;gap:32px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.grid-cols-small-4{display:grid;gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.grid-cols-small-5{display:grid;gap:32px;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.grid-cols-small-6{display:grid;gap:32px;grid-template-columns:repeat(6,minmax(0,1fr));width:100%}.grid-cols-small-7{display:grid;gap:32px;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}.grid-cols-small-8{display:grid;gap:32px;grid-template-columns:repeat(8,minmax(0,1fr));width:100%}.grid-cols-small-9{display:grid;gap:32px;grid-template-columns:repeat(9,minmax(0,1fr));width:100%}.grid-cols-small-10{display:grid;gap:32px;grid-template-columns:repeat(10,minmax(0,1fr));width:100%}.grid-cols-small-11{display:grid;gap:32px;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}.grid-cols-small-12{display:grid;gap:32px;grid-template-columns:repeat(12,minmax(0,1fr));width:100%}}@media (min-width:1024px){.grid-cols-medium-1{display:grid;gap:32px;grid-template-columns:repeat(1,minmax(0,1fr));width:100%}.grid-cols-medium-2{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.grid-cols-medium-3{display:grid;gap:32px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.grid-cols-medium-4{display:grid;gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.grid-cols-medium-5{display:grid;gap:32px;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.grid-cols-medium-6{display:grid;gap:32px;grid-template-columns:repeat(6,minmax(0,1fr));width:100%}.grid-cols-medium-7{display:grid;gap:32px;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}.grid-cols-medium-8{display:grid;gap:32px;grid-template-columns:repeat(8,minmax(0,1fr));width:100%}.grid-cols-medium-9{display:grid;gap:32px;grid-template-columns:repeat(9,minmax(0,1fr));width:100%}.grid-cols-medium-10{display:grid;gap:32px;grid-template-columns:repeat(10,minmax(0,1fr));width:100%}.grid-cols-medium-11{display:grid;gap:32px;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}.grid-cols-medium-12{display:grid;gap:32px;grid-template-columns:repeat(12,minmax(0,1fr));width:100%}}@media (min-width:1200px){.grid-cols-large-1{display:grid;gap:32px;grid-template-columns:repeat(1,minmax(0,1fr));width:100%}.grid-cols-large-2{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.grid-cols-large-3{display:grid;gap:32px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.grid-cols-large-4{display:grid;gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.grid-cols-large-5{display:grid;gap:32px;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.grid-cols-large-6{display:grid;gap:32px;grid-template-columns:repeat(6,minmax(0,1fr));width:100%}.grid-cols-large-7{display:grid;gap:32px;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}.grid-cols-large-8{display:grid;gap:32px;grid-template-columns:repeat(8,minmax(0,1fr));width:100%}.grid-cols-large-9{display:grid;gap:32px;grid-template-columns:repeat(9,minmax(0,1fr));width:100%}.grid-cols-large-10{display:grid;gap:32px;grid-template-columns:repeat(10,minmax(0,1fr));width:100%}.grid-cols-large-11{display:grid;gap:32px;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}.grid-cols-large-12{display:grid;gap:32px;grid-template-columns:repeat(12,minmax(0,1fr));width:100%}}@media (min-width:1440px){.grid-cols-xlarge-1{display:grid;gap:32px;grid-template-columns:repeat(1,minmax(0,1fr));width:100%}.grid-cols-xlarge-2{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.grid-cols-xlarge-3{display:grid;gap:32px;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}.grid-cols-xlarge-4{display:grid;gap:32px;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.grid-cols-xlarge-5{display:grid;gap:32px;grid-template-columns:repeat(5,minmax(0,1fr));width:100%}.grid-cols-xlarge-6{display:grid;gap:32px;grid-template-columns:repeat(6,minmax(0,1fr));width:100%}.grid-cols-xlarge-7{display:grid;gap:32px;grid-template-columns:repeat(7,minmax(0,1fr));width:100%}.grid-cols-xlarge-8{display:grid;gap:32px;grid-template-columns:repeat(8,minmax(0,1fr));width:100%}.grid-cols-xlarge-9{display:grid;gap:32px;grid-template-columns:repeat(9,minmax(0,1fr));width:100%}.grid-cols-xlarge-10{display:grid;gap:32px;grid-template-columns:repeat(10,minmax(0,1fr));width:100%}.grid-cols-xlarge-11{display:grid;gap:32px;grid-template-columns:repeat(11,minmax(0,1fr));width:100%}.grid-cols-xlarge-12{display:grid;gap:32px;grid-template-columns:repeat(12,minmax(0,1fr));width:100%}}.grid-gap-4px{gap:4px}.grid-gap-8px{gap:8px}.grid-gap-16px{gap:16px}.grid-gap-30px{gap:30px}.grid-gap-32px{gap:32px}.grid-gap-64px{gap:64px}.grid-gap-128px{gap:128px}@media (min-width:0){.grid-col-span-xsmall-1,.grid-col-xsmall-1{grid-column:span 1}.grid-row-span-xsmall-1,.grid-row-xsmall-1{grid-row:span 1}.grid-col-span-xsmall-2,.grid-col-xsmall-2{grid-column:span 2}.grid-row-span-xsmall-2,.grid-row-xsmall-2{grid-row:span 2}.grid-col-span-xsmall-3,.grid-col-xsmall-3{grid-column:span 3}.grid-row-span-xsmall-3,.grid-row-xsmall-3{grid-row:span 3}.grid-col-span-xsmall-4,.grid-col-xsmall-4{grid-column:span 4}.grid-row-span-xsmall-4,.grid-row-xsmall-4{grid-row:span 4}.grid-col-span-xsmall-5,.grid-col-xsmall-5{grid-column:span 5}.grid-row-span-xsmall-5,.grid-row-xsmall-5{grid-row:span 5}.grid-col-span-xsmall-6,.grid-col-xsmall-6{grid-column:span 6}.grid-row-span-xsmall-6,.grid-row-xsmall-6{grid-row:span 6}.grid-col-span-xsmall-7,.grid-col-xsmall-7{grid-column:span 7}.grid-row-span-xsmall-7,.grid-row-xsmall-7{grid-row:span 7}.grid-col-span-xsmall-8,.grid-col-xsmall-8{grid-column:span 8}.grid-row-span-xsmall-8,.grid-row-xsmall-8{grid-row:span 8}.grid-col-span-xsmall-9,.grid-col-xsmall-9{grid-column:span 9}.grid-row-span-xsmall-9,.grid-row-xsmall-9{grid-row:span 9}.grid-col-span-xsmall-10,.grid-col-xsmall-10{grid-column:span 10}.grid-row-span-xsmall-10,.grid-row-xsmall-10{grid-row:span 10}.grid-col-span-xsmall-11,.grid-col-xsmall-11{grid-column:span 11}.grid-row-span-xsmall-11,.grid-row-xsmall-11{grid-row:span 11}.grid-col-span-xsmall-12,.grid-col-xsmall-12{grid-column:span 12}.grid-row-span-xsmall-12,.grid-row-xsmall-12{grid-row:span 12}}@media (min-width:640px){.grid-col-small-1,.grid-col-span-small-1{grid-column:span 1}.grid-row-small-1,.grid-row-span-small-1{grid-row:span 1}.grid-col-small-2,.grid-col-span-small-2{grid-column:span 2}.grid-row-small-2,.grid-row-span-small-2{grid-row:span 2}.grid-col-small-3,.grid-col-span-small-3{grid-column:span 3}.grid-row-small-3,.grid-row-span-small-3{grid-row:span 3}.grid-col-small-4,.grid-col-span-small-4{grid-column:span 4}.grid-row-small-4,.grid-row-span-small-4{grid-row:span 4}.grid-col-small-5,.grid-col-span-small-5{grid-column:span 5}.grid-row-small-5,.grid-row-span-small-5{grid-row:span 5}.grid-col-small-6,.grid-col-span-small-6{grid-column:span 6}.grid-row-small-6,.grid-row-span-small-6{grid-row:span 6}.grid-col-small-7,.grid-col-span-small-7{grid-column:span 7}.grid-row-small-7,.grid-row-span-small-7{grid-row:span 7}.grid-col-small-8,.grid-col-span-small-8{grid-column:span 8}.grid-row-small-8,.grid-row-span-small-8{grid-row:span 8}.grid-col-small-9,.grid-col-span-small-9{grid-column:span 9}.grid-row-small-9,.grid-row-span-small-9{grid-row:span 9}.grid-col-small-10,.grid-col-span-small-10{grid-column:span 10}.grid-row-small-10,.grid-row-span-small-10{grid-row:span 10}.grid-col-small-11,.grid-col-span-small-11{grid-column:span 11}.grid-row-small-11,.grid-row-span-small-11{grid-row:span 11}.grid-col-small-12,.grid-col-span-small-12{grid-column:span 12}.grid-row-small-12,.grid-row-span-small-12{grid-row:span 12}}@media (min-width:1024px){.grid-col-medium-1,.grid-col-span-medium-1{grid-column:span 1}.grid-row-medium-1,.grid-row-span-medium-1{grid-row:span 1}.grid-col-medium-2,.grid-col-span-medium-2{grid-column:span 2}.grid-row-medium-2,.grid-row-span-medium-2{grid-row:span 2}.grid-col-medium-3,.grid-col-span-medium-3{grid-column:span 3}.grid-row-medium-3,.grid-row-span-medium-3{grid-row:span 3}.grid-col-medium-4,.grid-col-span-medium-4{grid-column:span 4}.grid-row-medium-4,.grid-row-span-medium-4{grid-row:span 4}.grid-col-medium-5,.grid-col-span-medium-5{grid-column:span 5}.grid-row-medium-5,.grid-row-span-medium-5{grid-row:span 5}.grid-col-medium-6,.grid-col-span-medium-6{grid-column:span 6}.grid-row-medium-6,.grid-row-span-medium-6{grid-row:span 6}.grid-col-medium-7,.grid-col-span-medium-7{grid-column:span 7}.grid-row-medium-7,.grid-row-span-medium-7{grid-row:span 7}.grid-col-medium-8,.grid-col-span-medium-8{grid-column:span 8}.grid-row-medium-8,.grid-row-span-medium-8{grid-row:span 8}.grid-col-medium-9,.grid-col-span-medium-9{grid-column:span 9}.grid-row-medium-9,.grid-row-span-medium-9{grid-row:span 9}.grid-col-medium-10,.grid-col-span-medium-10{grid-column:span 10}.grid-row-medium-10,.grid-row-span-medium-10{grid-row:span 10}.grid-col-medium-11,.grid-col-span-medium-11{grid-column:span 11}.grid-row-medium-11,.grid-row-span-medium-11{grid-row:span 11}.grid-col-medium-12,.grid-col-span-medium-12{grid-column:span 12}.grid-row-medium-12,.grid-row-span-medium-12{grid-row:span 12}}@media (min-width:1200px){.grid-col-large-1,.grid-col-span-large-1{grid-column:span 1}.grid-row-large-1,.grid-row-span-large-1{grid-row:span 1}.grid-col-large-2,.grid-col-span-large-2{grid-column:span 2}.grid-row-large-2,.grid-row-span-large-2{grid-row:span 2}.grid-col-large-3,.grid-col-span-large-3{grid-column:span 3}.grid-row-large-3,.grid-row-span-large-3{grid-row:span 3}.grid-col-large-4,.grid-col-span-large-4{grid-column:span 4}.grid-row-large-4,.grid-row-span-large-4{grid-row:span 4}.grid-col-large-5,.grid-col-span-large-5{grid-column:span 5}.grid-row-large-5,.grid-row-span-large-5{grid-row:span 5}.grid-col-large-6,.grid-col-span-large-6{grid-column:span 6}.grid-row-large-6,.grid-row-span-large-6{grid-row:span 6}.grid-col-large-7,.grid-col-span-large-7{grid-column:span 7}.grid-row-large-7,.grid-row-span-large-7{grid-row:span 7}.grid-col-large-8,.grid-col-span-large-8{grid-column:span 8}.grid-row-large-8,.grid-row-span-large-8{grid-row:span 8}.grid-col-large-9,.grid-col-span-large-9{grid-column:span 9}.grid-row-large-9,.grid-row-span-large-9{grid-row:span 9}.grid-col-large-10,.grid-col-span-large-10{grid-column:span 10}.grid-row-large-10,.grid-row-span-large-10{grid-row:span 10}.grid-col-large-11,.grid-col-span-large-11{grid-column:span 11}.grid-row-large-11,.grid-row-span-large-11{grid-row:span 11}.grid-col-large-12,.grid-col-span-large-12{grid-column:span 12}.grid-row-large-12,.grid-row-span-large-12{grid-row:span 12}}@media (min-width:1440px){.grid-col-span-xlarge-1,.grid-col-xlarge-1{grid-column:span 1}.grid-row-span-xlarge-1,.grid-row-xlarge-1{grid-row:span 1}.grid-col-span-xlarge-2,.grid-col-xlarge-2{grid-column:span 2}.grid-row-span-xlarge-2,.grid-row-xlarge-2{grid-row:span 2}.grid-col-span-xlarge-3,.grid-col-xlarge-3{grid-column:span 3}.grid-row-span-xlarge-3,.grid-row-xlarge-3{grid-row:span 3}.grid-col-span-xlarge-4,.grid-col-xlarge-4{grid-column:span 4}.grid-row-span-xlarge-4,.grid-row-xlarge-4{grid-row:span 4}.grid-col-span-xlarge-5,.grid-col-xlarge-5{grid-column:span 5}.grid-row-span-xlarge-5,.grid-row-xlarge-5{grid-row:span 5}.grid-col-span-xlarge-6,.grid-col-xlarge-6{grid-column:span 6}.grid-row-span-xlarge-6,.grid-row-xlarge-6{grid-row:span 6}.grid-col-span-xlarge-7,.grid-col-xlarge-7{grid-column:span 7}.grid-row-span-xlarge-7,.grid-row-xlarge-7{grid-row:span 7}.grid-col-span-xlarge-8,.grid-col-xlarge-8{grid-column:span 8}.grid-row-span-xlarge-8,.grid-row-xlarge-8{grid-row:span 8}.grid-col-span-xlarge-9,.grid-col-xlarge-9{grid-column:span 9}.grid-row-span-xlarge-9,.grid-row-xlarge-9{grid-row:span 9}.grid-col-span-xlarge-10,.grid-col-xlarge-10{grid-column:span 10}.grid-row-span-xlarge-10,.grid-row-xlarge-10{grid-row:span 10}.grid-col-span-xlarge-11,.grid-col-xlarge-11{grid-column:span 11}.grid-row-span-xlarge-11,.grid-row-xlarge-11{grid-row:span 11}.grid-col-span-xlarge-12,.grid-col-xlarge-12{grid-column:span 12}.grid-row-span-xlarge-12,.grid-row-xlarge-12{grid-row:span 12}}*,:after,:before{box-sizing:border-box}.demo{border-bottom:1px solid rgba(0,0,0,.25);padding:50px 0}.demo+.demo{padding:100px 0}.demo ul{align-items:center;display:flex;justify-content:flex-start;list-style:none;margin:0;padding:0}.demo li{padding:0 10px 0 0}.demo code,.demo pre{display:block;font-size:14px;height:0;margin:0;opacity:0;overflow:hidden;padding:0;transition:all .25s ease-in-out;visibility:hidden}.demo code.visible,.demo pre.visible{height:100%;opacity:1;overflow-y:scroll;visibility:visible}.demo .toc{border:1px solid rgba(0,0,0,.25);max-width:400px;padding-bottom:20px;padding-top:20px}.demo-section,.demo-section-full-width{margin:20px auto}.breakpoint-display{background-color:#fff;box-shadow:0 2px 4px rgba(0,0,0,.18);left:0;margin:0;padding:20px 0;position:fixed;text-align:center;top:0;width:100%}.breakpoint-display h1{margin:0;padding:0}.spacer{margin-bottom:100px}.grid>div{align-items:center;background-color:#f0f0f0;border:1px solid #ccc;display:flex;font-size:14px;font-weight:700;justify-content:center;padding:10px;text-align:center}