@charset "UTF-8";
[id]{
    scroll-margin-top:2ex
}
:root{
    --base-font-family:"Nunito",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans","Helvetica Neue",Arial,sans-serif;
    --base-font-size:1.8rem;
    --base-line-height:1.5;
    --monospace-font-family:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
    --monospace-font-size:1.65rem;
    --monospace-line-height:1.5;
    --content-max-width:800px;
    --content-horizontal-padding-xs:1.5rem;
    --content-horizontal-padding-md:2.5rem;
    --color-tomorrow-background:#202020;
    --color-tomorrow-foreground:#eaeaea;
    --color-tomorrow-red:#f1486d;
    --color-tomorrow-orange:#e78c45;
    --color-tomorrow-yellow:#e7c547;
    --color-tomorrow-green:#b9ca4a;
    --color-tomorrow-blue:#7aa6da;
    --color-tomorrow-cyan:#9cdcfe;
    --color-tomorrow-purple:#c397d8;
    --color-tomorrow-comment:#969896
}
blockquote,body,dd,dl,dt,fieldset,figure,h1,h2,h3,h4,hr,html,iframe,legend,li,ol,p,pre,ul{
    margin:0;
    padding:0;
    font:inherit
}
html{
    box-sizing:border-box;
    background-repeat:no-repeat;
    -webkit-text-size-adjust:100%
}
*,::after,::before{
    box-sizing:inherit;
    background-repeat:inherit
}
::after,::before{
    text-decoration:inherit;
    vertical-align:inherit
}
[tabindex],a,area,button,input,label,select,summary{
    touch-action:manipulation
}
img{
    max-width:100%;
    height:auto
}
iframe{
    border:0
}
table{
    border-collapse:collapse;
    border-spacing:0;
    caption-side:bottom
}
th{
    text-align:left
}
hr{
    box-sizing:content-box;
    height:0
}
:root,[data-theme=default]{
    --color-accent:#783cb9;
    --color-text-default:#1f303e;
    --color-text-offset:#686c71;
    --color-text-accent:var(--color-accent);
    --color-text-interaction:#0095ac;
    --color-text-success:#4d7500;
    --color-text-danger:#d22006;
    --color-background-default:#fff;
    --color-background-offset:#f1f3f6;
    --color-background-success:#ddf9c7;
    --color-background-warning:#fef2e4;
    --color-background-danger:#fff3f2;
    --color-background-info:#edf5ff;
    --color-background-disabled:#e6e6e2;
    --color-border-default:#dfe1e2;
    --color-border-success:#7d9b4e;
    --color-border-warning:#dd7533;
    --color-border-danger:#e9695f;
    --color-border-info:#0095ac;
    --color-focus-ring:hsla(219, 100%, 50%, 0.5);
    --color-box-shadow:rgba(0, 0, 0, 0.1);
    --color-backdrop:rgba(255, 255, 255, 0.6);
    --button-primary-color:#0070ca;
    --button-secondary-color:#745da2;
    --button-secondary-focus-ring:#c39deb;
    --button-danger-color:var(--color-text-danger);
    --button-danger-focus-ring:#f2938c;
    --button-disabled-color:#76766a;
    --inverted-color-text-default:#fff;
    --inverted-color-background-default:#233c51;
    --inverted-color-text-interaction:#ffbe2e;
    --inverted-color-focus-ring:hsla(49, 100%, 49%, 0.5)
}
.dk-theme-picker{
    display:inline-block
}
.dk-theme-picker:empty{
    display:none
}
.dk-theme-picker button{
    --btn-color-background:rgba(0, 0, 0, 0.4);
    position:relative;
    width:4rem;
    height:4rem;
    overflow:hidden;
    padding:0;
    cursor:pointer
}
.dk-theme-picker button svg{
    position:absolute;
    top:.5rem;
    left:.5rem;
    width:3rem;
    height:3rem;
    color:var(--inverted-color-text-interaction);
    transition:transform 1s cubic-bezier(.4,0,.2,1);
    transform-origin:50% 100px;
    rotate:0deg
}
[data-theme=default] {
    transform:rotate(-90deg)
}

html{
    font-size:62.5%;
    word-wrap:break-word
}
body{
    font-family:var(--base-font-family);
    font-size:var(--base-font-size);
    line-height:var(--base-line-height);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    color:var(--color-text-default);
    background-color:var(--color-background-default)
}
body,html{
    height:100%
}
body{
    display:flex;
    flex-direction:column
}
code,pre{
    font-family:var(--monospace-font-family);
    font-size:var(--monospace-font-size);
    line-height:var(--monospace-line-height)
}
main{
    flex:1 0 auto;
    width:100%;
    margin:4rem auto
}
pre{
    overflow:auto;
    padding:var(--content-horizontal-padding-xs);
    margin-left:calc(var(--content-horizontal-padding-xs) * -1);
    margin-right:calc(var(--content-horizontal-padding-xs) * -1);
    background-color:var(--color-background-offset)
}
@media (min-width:768px){
    pre{
        border-radius:5px
    }
}
a{
    color:var(--color-text-interaction);
    text-decoration:none;
    text-underline-offset:.3rem
}
a:focus,a:hover{
    text-decoration:underline;
    text-decoration-thickness:.2rem;
    text-underline-offset:.5rem
}
hr{
    border:none;
    border-top:1px solid var(--color-border-default)
}
blockquote{
    margin:2rem 0;
    padding:2rem 3rem;
    border-left:.4rem solid var(--color-accent);
    border-radius:.4rem;
    background-color:var(--color-background-offset)
}
table{
    display:block;
    width:-moz-max-content;
    width:max-content;
    max-width:100%;
    overflow:auto;
    margin-right:auto;
    margin-left:auto
}
td,th{
    padding:1rem 2rem 1rem 1rem;
    vertical-align:top
}
tbody tr:nth-child(odd){
    background-color:var(--color-background-offset)
}
.article-section,blockquote,dl,figure,ol,p,pre,section,table,ul{
    margin-bottom:2.4rem
}
.article-section:last-child,blockquote:last-child,dl:last-child,figure:last-child,ol:last-child,p:last-child,pre:last-child,section:last-child,table:last-child,ul:last-child{
    margin-bottom:0
}
blockquote{
    margin-top:3rem;
    margin-bottom:3rem;
    font-style:italic
}
ol,ul{
    margin-top:.7rem;
    margin-left:3.8rem
}
ol ol,ul ul{
    margin-bottom:0
}
ul{
    list-style:disc outside
}
ul ul{
    list-style-type:circle
}
ul ul ul{
    list-style-type:square
}
li{
    padding-left:.5rem
}
li+li{
    margin-top:.5rem
}
hr{
    margin-top:4rem;
    margin-bottom:4rem
}
h1{
    font-size:3.8rem;
    line-height:1;
    font-weight:800;
    margin-bottom:3rem
}
h2{
    font-size:3rem;
    line-height:1.2;
    font-weight:700;
    margin-bottom:2rem
}
h2:not(:first-child){
    margin-top:5.8rem
}
hr+h2:not(:first-child){
    margin-top:4rem
}
h3{
    font-size:2.4rem;
    line-height:1.25;
    font-weight:500;
    margin-top:4.2rem;
    margin-bottom:1.8rem
}
h4{
    font-size:2rem;
    line-height:1.35;
    font-weight:500;
    margin-top:3.2rem;
    margin-bottom:1.8rem
}
.prose a{
    text-decoration-line:underline;
    transition:text-underline-offset .1s
}
.prose a:focus{
    transition:none
}
code{
    display:inline-block;
    padding:0 .6rem;
    color:var(--color-text-default);
    background-color:var(--color-background-offset);
    border:1px solid var(--color-border-default)
}
code{
    white-space:pre-wrap;
    word-break:break-word;
    border-radius:5px
}
pre code{
    padding:0 var(--content-horizontal-padding-xs) 0 0;
    white-space:pre;
    color:inherit;
    background-color:inherit;
    border:none
}
.inverted{
    --color-text-default:var(--inverted-color-text-default);
    --color-text-interaction:var(--inverted-color-text-interaction);
    --color-background-default:var(--inverted-color-background-default);
    --color-focus-ring:var(--inverted-color-focus-ring);
    color:var(--inverted-color-text-default);
    background:var(--inverted-color-background-default)
}
.layout-content{
    max-width:var(--content-max-width);
    padding-inline:var(--content-horizontal-padding-xs)
}
@media (min-width:768px){
    .layout-content{
        padding-inline:var(--content-horizontal-padding-md)
    }
}

dk-alert-box{
    display:block;
    margin:3rem 0;
    padding:2rem 3rem;
    border:1px solid var(--alert-border);
    border-left-width:.5rem;
    border-radius:.4rem;
    background-color:var(--alert-background)
}
dk-alert-box[type=info]{
    --alert-border:var(--color-border-info);
    --alert-background:var(--color-background-info)
}
dk-alert-box[type=warning]{
    --alert-border:var(--color-border-warning);
    --alert-background:var(--color-background-warning)
}
dk-alert-box[type=danger]{
    --alert-border:var(--color-border-danger);
    --alert-background:var(--color-background-danger)
}
dk-alert-box[type=success]{
    --alert-border:var(--color-border-success);
    --alert-background:var(--color-background-success)
}

.py-7{
    padding-top:3rem;
    padding-bottom:3rem
}

.flex{
    display:flex
}

.items-start{
    align-items:flex-start
}

.pb-7{
    padding-bottom:3rem
}

.text-2{
    font-size:1.4rem;
    line-height:1.6
}

.text-4{
    font-size:1.8rem;
    line-height:1.5
}

.font-bold{
    font-weight:700
}

.text-offset{
    color:var(--color-text-offset)
}

.mr-5{
    margin-right:1.5rem;
		margin-top: 4px;		
}
.no-pad-mar {
	padding: 0;
	margin: 0;
}