:root{--ic-brand-primary:#0770A3;--ic-brand-primary-darkened-5:#065f8b;--ic-brand-primary-darkened-10:#054e72;--ic-brand-primary-lightened-15:#0aa2ec;--ic-link-color:#0073A7;--ic-link-color-darkened-10:#005074;--ic-link-color-lightened-10:#005074}.Sg-Main code,.Sg-Main pre{font-family:"Monaco","Courier",monospace;font-size:16px;font-size:1rem;border:1px solid #e6e6e6;padding:2px 5px;border-radius:2px;background:#fff;margin:0;word-break:keep-all;word-wrap:normal;white-space:pre;color:var(--ic-brand-primary)}.Sg-Main .exampleOutput,.Sg-Main .code-rendered{border:1px solid #e6e6e6;border-bottom:none;border-top-left-radius:5px;border-top-right-radius:5px;margin:15px 0 0 0;padding:50px 10px 10px 10px;position:relative}.Sg-Main .exampleOutput:after,.Sg-Main .code-rendered:after{content:'Example';position:absolute;top:0;left:0;border-right:1px solid #e6e6e6;border-bottom:1px solid #e6e6e6;border-bottom-right-radius:4px;padding:5px 8px;display:inline-block;font-family:"Helvetica Neue","Helvetica",Arial,sans-serif;font-size:14px;font-size:.875rem}.Sg-Main .codeBlock,.Sg-Main .highlight{padding:50px 4%;margin:0 0 20px 0;background:#2D3B45;color:var(--ic-brand-primary);font-size:15px;font-size:.9375rem;line-height:1.6em;overflow-x:auto;position:relative;width:auto}.Sg-Main .codeBlock:after,.Sg-Main .highlight:after{content:'HTML';position:absolute;top:0;left:0;color:#556572;border-right:1px solid #415564;border-bottom:1px solid #415564;border-bottom-right-radius:4px;padding:5px 8px;display:inline-block;font-family:"Helvetica Neue","Helvetica",Arial,sans-serif;font-size:14px;font-size:.875rem}.Sg-Main .codeBlock.jsExample:after,.Sg-Main .highlight.jsExample:after{content:'JS'}.Sg-Main .codeBlock .highlight,.Sg-Main .highlight .highlight{background:#2D3B45}.Sg-Main .codeBlock pre,.Sg-Main .highlight pre{font-family:"Monaco","Courier",monospace;width:auto;background:#2D3B45;word-break:keep-all;word-wrap:normal;white-space:pre;margin:0px;padding:0px;padding-left:15px;font-size:16px;font-size:1rem;position:relative;line-height:1.6em;color:#e6e6e6;border:1px solid #2D3B45;overflow:visible}@media only screen and (max-width: 900px){.Sg-Main .codeBlock,.Sg-Main .highlight{padding:50px 10px}}.Sg-Main .codeBlock hll,.Sg-Main .highlight hll{background-color:#ffffcc}.Sg-Main .codeBlock .c,.Sg-Main .highlight .c{color:#999988;font-style:italic}.Sg-Main .codeBlock .err,.Sg-Main .highlight .err{color:#a61717}.Sg-Main .codeBlock .k,.Sg-Main .highlight .k{color:#ffffff}.Sg-Main .codeBlock .o,.Sg-Main .highlight .o{color:#ffffff}.Sg-Main .codeBlock .cm,.Sg-Main .highlight .cm{color:#999988;font-style:italic}.Sg-Main .codeBlock .cp,.Sg-Main .highlight .cp{color:#999999;font-style:italic}.Sg-Main .codeBlock .c1,.Sg-Main .highlight .c1{color:#999988;font-style:italic}.Sg-Main .codeBlock .cs,.Sg-Main .highlight .cs{color:#999999;font-style:italic}.Sg-Main .codeBlock .gd,.Sg-Main .highlight .gd{color:#ffffff;background-color:#ffdddd}.Sg-Main .codeBlock .ge,.Sg-Main .highlight .ge{color:#ffffff;font-style:italic}.Sg-Main .codeBlock .gr,.Sg-Main .highlight .gr{color:#aa0000}.Sg-Main .codeBlock .gh,.Sg-Main .highlight .gh{color:#999999}.Sg-Main .codeBlock .gi,.Sg-Main .highlight .gi{color:#ffffff;background-color:#ddffdd}.Sg-Main .codeBlock .go,.Sg-Main .highlight .go{color:#888888}.Sg-Main .codeBlock .gp,.Sg-Main .highlight .gp{color:#555555}.Sg-Main .codeBlock .gu,.Sg-Main .highlight .gu{color:#aaaaaa}.Sg-Main .codeBlock .gt,.Sg-Main .highlight .gt{color:#aa0000}.Sg-Main .codeBlock .kc,.Sg-Main .highlight .kc{color:#ffffff}.Sg-Main .codeBlock .kd,.Sg-Main .highlight .kd{color:#ffffff}.Sg-Main .codeBlock .kn,.Sg-Main .highlight .kn{color:#ffffff}.Sg-Main .codeBlock .kp,.Sg-Main .highlight .kp{color:#ffffff}.Sg-Main .codeBlock .kr,.Sg-Main .highlight .kr{color:#ffffff}.Sg-Main .codeBlock .kt,.Sg-Main .highlight .kt{color:#445588}.Sg-Main .codeBlock .m,.Sg-Main .highlight .m{color:#009999}.Sg-Main .codeBlock .s,.Sg-Main .highlight .s{color:#E6DB74}.Sg-Main .codeBlock .na,.Sg-Main .highlight .na{color:#A6E22E}.Sg-Main .codeBlock .nb,.Sg-Main .highlight .nb{color:#66D9EF}.Sg-Main .codeBlock .nc,.Sg-Main .highlight .nc{color:#445588}.Sg-Main .codeBlock .no,.Sg-Main .highlight .no{color:#A6E22E}.Sg-Main .codeBlock .nd,.Sg-Main .highlight .nd{color:#3c5d5d}.Sg-Main .codeBlock .ni,.Sg-Main .highlight .ni{color:#AE81FF}.Sg-Main .codeBlock .ne,.Sg-Main .highlight .ne{color:#990000}.Sg-Main .codeBlock .nf,.Sg-Main .highlight .nf{color:#990000}.Sg-Main .codeBlock .nl,.Sg-Main .highlight .nl{color:#990000}.Sg-Main .codeBlock .nn,.Sg-Main .highlight .nn{color:#555555}.Sg-Main .codeBlock .nt,.Sg-Main .highlight .nt{color:#0099E0}.Sg-Main .codeBlock .nv,.Sg-Main .highlight .nv{color:#A6E22E}.Sg-Main .codeBlock .ow,.Sg-Main .highlight .ow{color:#ffffff}.Sg-Main .codeBlock .w,.Sg-Main .highlight .w{color:#bbbbbb}.Sg-Main .codeBlock .mf,.Sg-Main .highlight .mf{color:#009999}.Sg-Main .codeBlock .mh,.Sg-Main .highlight .mh{color:#009999}.Sg-Main .codeBlock .mi,.Sg-Main .highlight .mi{color:#009999}.Sg-Main .codeBlock .mo,.Sg-Main .highlight .mo{color:#009999}.Sg-Main .codeBlock .sb,.Sg-Main .highlight .sb{color:#E6DB74}.Sg-Main .codeBlock .sc,.Sg-Main .highlight .sc{color:#E6DB74}.Sg-Main .codeBlock .sd,.Sg-Main .highlight .sd{color:#E6DB74}.Sg-Main .codeBlock .s2,.Sg-Main .highlight .s2{color:#E6DB74}.Sg-Main .codeBlock .se,.Sg-Main .highlight .se{color:#E6DB74}.Sg-Main .codeBlock .sh,.Sg-Main .highlight .sh{color:#E6DB74}.Sg-Main .codeBlock .si,.Sg-Main .highlight .si{color:#E6DB74}.Sg-Main .codeBlock .sx,.Sg-Main .highlight .sx{color:#E6DB74}.Sg-Main .codeBlock .sr,.Sg-Main .highlight .sr{color:#009926}.Sg-Main .codeBlock .s1,.Sg-Main .highlight .s1{color:#E6DB74}.Sg-Main .codeBlock .ss,.Sg-Main .highlight .ss{color:#990073}.Sg-Main .codeBlock .bp,.Sg-Main .highlight .bp{color:#999999}.Sg-Main .codeBlock .vc,.Sg-Main .highlight .vc{color:#A6E22E}.Sg-Main .codeBlock .vg,.Sg-Main .highlight .vg{color:#A6E22E}.Sg-Main .codeBlock .vi,.Sg-Main .highlight .vi{color:#A6E22E}.Sg-Main .codeBlock .il,.Sg-Main .highlight .il{color:#009999}.Sg-header__Navigation,.Sg-header__Subnavigation{display:-moz-flexbox;display:-o-flexbox;display:flexbox;display:-webkit-flex;display:flex}.Sg-header__Navigation,.Sg-header__Subnavigation{box-flex:1;-webkit-flex:1;flex:1}.Sg-header__Navigation,.Sg-header__Subnavigation{-webkit-align-content:center;align-content:center}.Sg-header__Navigation,.Sg-header__Subnavigation{-webkit-justify-content:center;justify-content:center}.Sg-header__Navigation-item{-webkit-align-self:center;align-self:center}html.Sg-only{margin:0;padding:0;line-height:normal;font-family:"Helvetica Neue","Helvetica",Arial,sans-serif}body.Sg-only{margin:0;padding:0;line-height:1.5;background:#fff}.Sg-header{background:#394B58;position:fixed;width:100%;z-index:999}.Sg-header__Navigation{background:transparent url("/dist/images/sg-logo-3bf08eba1f.svg") 1% 50% no-repeat;background-size:23px}.Sg-header__Navigation-item{color:#fff;font-size:18px;font-size:1.125rem;padding:13px 15px;text-transform:capitalize;text-decoration:none}.Sg-header__Navigation-item:hover{text-decoration:none;color:#e6e6e6;background:#2D3B45}.Sg-header__Navigation-item:focus{text-decoration:none;color:#fff}.Sg-header__Navigation-item.active{background:#2D3B45;color:#fff}.Sg-header__Subnavigation{background:#2D3B45}.Sg-header__Subnavigation-item,.Sg-header__Subnavigation-item:active,.Sg-header__Subnavigation-item:visited,.Sg-header__Subnavigation-item:focus{font-size:13px;font-size:.8125rem;padding:8px 10px;font-weight:bold;color:#fff;text-decoration:none}.Sg-header__Subnavigation-item:hover{color:#e6e6e6;text-decoration:none}.Sg-Main{padding-top:85px}.Sg-Content>h1,.Sg-Article>h1{background:var(--ic-brand-primary);color:#fff;font-size:48px;font-size:3rem;font-weight:100;text-align:center;padding:40px 0;margin:0}.Sg-Content>h2,.Sg-Article>h2{padding:3px 0;margin:25px 0;text-transform:capitalize;font-size:20px;font-size:1.25rem;text-align:center;border-top:1px solid #556572;border-bottom:1px solid #556572}.Sg-Content>p,.Sg-Article>p{font-size:18px;font-size:1.125rem;text-align:center;margin:0}.Sg-Content>ul,.Sg-Content>dl,.Sg-Content>ol,.Sg-Article>ul,.Sg-Article>dl,.Sg-Article>ol{margin:10px 20px}.Sg-Content>ul li,.Sg-Content>dl li,.Sg-Content>ol li,.Sg-Article>ul li,.Sg-Article>dl li,.Sg-Article>ol li{font-size:18px;font-size:1.125rem}.Sg-Content>hr,.Sg-Article>hr{border:none;background:none;padding:0;margin:5px 0;height:1px}.Sg-Content>hr.Ruler--dotted,.Sg-Article>hr.Ruler--dotted{border-top:1px dotted #394B58}.Sg-Content .sg-src-file-path,.Sg-Article .sg-src-file-path{text-align:center;padding:5px 0;background:var(--ic-brand-primary);border-top:1px solid #fff;color:#fff}.Sg-Main{overflow-x:hidden}.Sg-Section{padding-bottom:100px}.Sg-Header{height:85px}.Sg-Anchor{display:block;height:85px;margin-top:-85px;visibility:hidden}.Sg-header__Subnavigation-item{display:inline-block}.styleguide-section__grid-demo-element{padding:8px 16px;background:var(--ic-link-color-lightened-10);color:white;text-align:center;text-transform:uppercase;height:16px}.Sg-Main .codeBlock:after,.Sg-Main .highlight:after{content:'Code'}.Sg-Main .codeBlock:after,.Sg-Main .highlight:after{content:'Code'}.isHidden{display:none}.styleguide-section__accordion-demo-element{padding:24px;color:#bfbfbf}.ReactModal__Content.ReactModal__Content--canvas.ReactModal__Content--demo-styleguide .ReactModal__Layout{-webkit-transform:none;transform:none;opacity:1;width:100%;max-width:697px}.Colorguide-color{-webkit-justify-content:space-between;justify-content:space-between;padding:145px 0 0 0;-webkit-flex:1 170px;flex:1 170px;margin:5px;border:1px solid #fff;border-radius:3px}.Colorguide-var{display:block;background:#fff;border-top:1px solid #fff;padding:10px}.Colorguide-color--primary{background:var(--ic-brand-primary)}.Colorguide-color--success{background:#127A1B}.Colorguide-color--action{background:#B8309E}.Colorguide-color--danger{background:#D01A19}.Colorguide-color--alert{background:#C23C0D}.Colorguide-color--dark{background:#2D3B45}.Colorguide-color--medium-darker{background:#394B58}.Colorguide-color--medium{background:#556572}.Colorguide-color--medium-lighter{background:#556572}.Colorguide-color--border-dark{background:#A5AFB5}.Colorguide-color--border-light{background:#C7CDD1}.Colorguide-color--medium-light{background:#fff}.Colorguide-color--light{background:#fff}.sg-bg-color-example{background:#E6F1F7;font-size:16px;font-size:1rem;padding:12px;color:#0770A3;border:1px solid #0770A3}.sg-bg-color-example--neutral{background:#EBEDEE;color:#394B58;border:1px solid #394B58}.sg-bg-color-example--success{background:#E8F2E9;color:#127A1B;border:1px solid #127A1B}.sg-bg-color-example--alert{background:#F9ECE8;color:#C23C0D;border:1px solid #C23C0D}.sg-bg-color-example--danger{background:#FBE8E8;color:#D01A19;border:1px solid #D01A19}