@media only screen and (max-width: 500px) {
    #moobile {
        display: block;
    }
    #desktoop {
        display: none;
    }
  }

  @media only screen and (min-width: 501px) {
    #moobile {
        display: none;
    }
    #desktoop {
        display: block;
    }
  }


button{
    background:transparent;
    border:none;
    cursor:pointer;
    padding:0
}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
    display:block
}
body{
    line-height:1
}
ol,ul{
    list-style:none
}
blockquote,q{
    quotes:none
}
blockquote:after,blockquote:before,q:after,q:before{
    content:"";
    content:none
}
table{
    border-collapse:collapse;
    border-spacing:0
}
:root{
    --base-font-size:20px;
    --margin:16px;
    --max-content-width-unitless:600;
    --max-content-width:600px;
    --min-content-width:375px;
    --max-desktop-content-width:1366px;
    --above-above-canvas-z-index:2147483632;
    --overlay-z-index:2147483637;
    --above-overlay-z-index:2147483642;
    --max-z-index:2147483647;
    --reference-width:100vw;
    --sans-serif-font:"Inter",Arial,sans-serif;
    --monospace-font:"Roboto Mono",monospace;
    --code-font:"Fira Code",monospace
}
html{
    --page-reference-width:var(--max-content-width-unitless);
    --page-reference-width-px:var(--max-content-width-px);
    font-size:min(calc(var(--canvas-width) / var(--page-reference-width)),1px);
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    font-family:var(--sans-serif-font);
    height:100%;
    --canvas-width:var(--override-canvas-width,100vw);
    overflow-y:overlay
}
@media screen and (max-width:600px){
    html{
        --canvas-width:var(--override-canvas-width,var(--reference-width))
    }
}
body{
    font-size:var(--base-font-size);
    height:-moz-fit-content;
    height:fit-content;
    max-width:100vw;
    transition:background .1s ease-in-out
}
body,button{
    font-family:var(--sans-serif-font)
}
@media screen and (max-width:600px){
    :root{
        --margin:16px
    }
    .hide-on-mobile{
        display:none!important
    }
}
@media screen and (min-width:601px){
    .hide-on-desktop{
        display:none!important
    }
}
#next{
    width:100%;
    height:100%
}
.hide-powered-by-attribution #powered-by-attribution{
    display:none!important
}
#powered-by-attribution{
    text-transform:lowercase;
    position:fixed;
    bottom:var(--margin);
    left:var(--margin);
    z-index:var(--max-z-index)
}
#powered-by-attribution a{
    text-indent:-9999px;
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:var(--above-above-canvas-z-index)
}
#powered-by-attribution span{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    display:block;
    width:148px;
    left:0;
    font-weight:700;
    transition:all .15s ease-in-out;
    opacity:0;
    pointer-events:none
}
#powered-by-attribution:hover span{
    opacity:1;
    transform:translateY(-50%) translateX(68px)
}
#icon-logo{
    --first-phase:0.25s;
    --delay:0.1s;
    --second-phase:0.25s;
    --third-phase:0.25s;
    display:block;
    width:48px;
    height:48px;
    border-radius:24px;
    border-color:transparent;
    opacity:1!important;
    transition:.15s ease-in-out
}
#icon-logo:hover svg{
    transform:scale(1.2)
}
@media screen and (max-width:600px){
    .builder-app #powered-by-attribution{
        display:none
    }
}
.inline-rich-text{
    display:inline-block;
    font-size:calc(var(--font-size) * var(--rpx))
}
.inline-rich-text.left{
    transform-origin:left
}
.inline-rich-text.center{
    transform-origin:center
}
.inline-rich-text.right{
    transform-origin:right
}
.inline-rich-text div[contenteditable]{
    outline:none;
    white-space:-moz-pre-space;
    -webkit-user-select:text;
    -moz-user-select:text;
    user-select:text
}
.renderable-icon{
    flex-shrink:0;
    height:calc(var(--height) * var(--rpx));
    width:calc(var(--width) * var(--rpx));
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    display:flex
}
.page-view{
    position:relative;
    width:100%;
    min-height:100vh;
    box-sizing:border-box;
    touch-action:manipulation;
    --rpx:1rem
}
.page-view h1{
    text-indent:-9999px;
    height:0
}
section[data-type=section]{
    position:relative;
    display:flex;
    height:-moz-fit-content;
    height:fit-content;
}
section[data-type=section]:last-child{
    overflow-y:hidden
}
section[data-type=section] div[data-type=content]{
    margin:0 auto;
    position:relative;
    height:100%;
    width:100%;
    height:calc(var(--height) * var(--rpx));
    max-width:calc(var(--max-width) * var(--parent-rpx));
    box-sizing:border-box
}
div[data-type=group]{
    position:relative
}
.block,div[data-type=group]{
    width:calc(var(--width) * var(--rpx));
    height:calc(var(--height) * var(--rpx));
    z-index:var(--z)
}
.block{
    display:block;
    position:absolute;
    transform:translate(-50%,-50%);
    transition:opacity .1s,box-shadow .1s;
    outline:none;
    touch-action:manipulation;
    text-size-adjust:none;
    box-sizing:border-box;
    left:calc(var(--x) * var(--rpx));
    top:calc(var(--y) * var(--rpx));
    --scale-x:1;
    --scale-y:1;
    --rotation:0;
    transform:translateZ(0) translate(-50%,-50%) rotate(calc(var(--rotation) * 1deg)) scaleX(var(--scale-x)) scaleY(var(--scale-y)) var(--block-hyperlink-hover-transform)
}
.block>div{
    position:relative;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:block;
    outline:none;
    z-index:0
}
.block.hyperlinked a.link-overlay{
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    left:0;
    z-index:1;
    text-indent:1000%;
    overflow:hidden;
    white-space:nowrap
}
.block.hyperlinked{
    transition:transform .1s ease-in-out
}
.block{
    --block-hyperlink-hover-transform:scale(1)
}
@media not all and (hover:none){
    .block.hyperlinked:hover{
        --block-hyperlink-hover-transform:scale(1.03)
    }
}
.block:not(.overflow-visible)>div{
    overflow:hidden
}
.block.no-pointer-events{
    pointer-events:none
}
.twitter-thing .twitter-tweet{
    margin:0 auto!important
}
.block.hidden{
    display:none
}
@media screen and (min-width:601px){
    .block.hide-on-desktop{
        display:none
    }
}
@media screen and (max-width:599px){
    .block.hide-on-mobile{
        display:none
    }
}
.block[data-type=embed] div.size-normalizer>div,div[data-embed=youtube]>div{
    width:100%!important;
    height:100%!important
}
div[data-embed=youtube].write-mode>div{
    pointer-events:none
}
div[data-embed=youtube] .youtube-play-button{
    width:68px
}
div[data-embed=youtube] .youtube-play-button .ytp-large-play-button-bg{
    transition:fill .1s cubic-bezier(.4,0,1,1),fill-opacity .1s cubic-bezier(.4,0,1,1);
    fill:#212121;
    fill-opacity:.8
}
@media not all and (hover:none){
    div[data-embed=youtube]:hover:not(.write-mode) .youtube-play-button .ytp-large-play-button-bg{
        transition:fill .1s cubic-bezier(.4,0,1,1),fill-opacity .1s cubic-bezier(.4,0,1,1);
        fill:red;
        fill-opacity:1
    }
}
.block[data-type=button] .button{
    text-align:center;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:6.4rem;
    font-weight:600;
    box-shadow:0 4px 8px rgb(0 0 0/8%);
    font-size:calc(var(--font-size) * var(--rpx))
}
.block[data-type=button] .button.light-bg{
    color:#000
}
.block[data-type=button] .button.dark-bg{
    text-shadow:1px 1px 2px rgba(0,0,0,.24);
    color:#fff
}
.block[data-type=button] .button.square span{
    display:none
}
.block[data-type=button] .button span{
    line-height:calc(var(--font-size) * var(--rpx) * 1.5);
    margin-left:calc(var(--font-size) * var(--rpx) + 27.6rem);
    outline:none;
    max-width:80%;
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap
}
.block[data-type=button] .button.instagram-bg{
    background:linear-gradient(45deg,#fda948 13%,#f66748 21%,#ec3653 64%,#c13a9c 84%)
}
.block[data-type=button] .button .icon-wrapper{
    left:27.6rem;
    position:absolute;
    width:calc(var(--font-size) * var(--rpx));
    height:calc(var(--font-size) * var(--rpx))
}
.block[data-type=button] .button.dark-bg .icon-wrapper{
    --drop-shadow:drop-shadow(1px 1px 2px rgba(0,0,0,.24));
    filter:var(--drop-shadow);
    -webkit-filter:var(--drop-shadow);
    -moz-filter:var(--drop-shadow);
    -o-filter:var(--drop-shadow);
    -ms-filter:var(--drop-shadow)
}
.block[data-type=button] .button .icon{
    width:100%;
    height:100%;
    mask-repeat:no-repeat;
    -webkit-mask-repeat:no-repeat;
    mask-position:center center;
    -webkit-mask-position:center center
}
.block[data-type=button] .button.light-bg .icon{
    background-color:#000
}
.block[data-type=button] .button.dark-bg .icon{
    background-color:#fff
}
.block[data-type=code-embed] .safe-mode-warning{
    background:rgba(0,0,0,.64);
    border:1px solid hsla(0,0%,100%,.24);
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
    padding:16px;
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px)
}
.block[data-type=code-embed] .safe-mode-warning span{
    font-size:16px;
    text-align:center;
    line-height:1.4;
    overflow:hidden;
    text-overflow:ellipsis;
    color:hsla(0,0%,100%,.64);
    display:block;
    height:44px;
    width:90px
}
.block[data-type=drawing]{
    display:flex;
    align-items:center;
    justify-content:center
}
.block[data-type=drawing],.block[data-type=drawing] svg{
    overflow:visible!important
}
.block[data-type=drawing] svg{
    width:100%;
    height:100%
}
.block[data-type=gif] img,.block[data-type=image] img{
    width:100%;
    height:100%;
    top:0;
    left:0;
    color:transparent
}
.block img:-moz-loading{
    visibility:hidden
}
.block[data-type=rich-button] a{
    --dampening:max(min(0.7,calc(var(--padding) / 24)),0.8);
    --smart-padding:calc(var(--dampening) * var(--padding) * var(--rpx));
    width:100%;
    height:100%;
    display:block;
    display:flex;
    align-items:center;
    justify-content:space-between;
    box-sizing:border-box;
    padding:0 var(--smart-padding);
    gap:var(--smart-padding)
}
.block[data-type=rich-button] a.icon-right{
    flex-direction:row-reverse
}
.block[data-type=rich-button] a.icon-left{
    flex-direction:row
}
.block[data-type=rich-button] a.dark-background .label{
    text-shadow:1px 1px 2px rgba(0,0,0,.24)
}
.block[data-type=rich-button] a .label{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    width:100%;
    display:table-cell;
    vertical-align:middle;
    line-height:calc(var(--height) * var(--rpx))
}
.block[data-type=rich-button] a .label.right{
    text-align:right
}
.block[data-type=rich-button] a .label.center{
    text-align:center
}
.block[data-type=rich-button] a .label.left{
    text-align:left
}
.block[data-type=rich-button] a.icon-none .icon{
    display:none
}
.block[data-type=shape] svg{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0
}
.text-content,.text-content *{
    font-size:calc(var(--font-size) * var(--scaler-multiplier) * 1px)
}
.text-content{
    --scaler-multiplier:1;
    --width-percent:100%
}
@supports (background:-webkit-named-image(i)){
    .text-content{
        --scaler-multiplier:10;
        --width-percent:1000%
    }
    .text-content:not(.legacy){
        font-size:calc(1em * var(--scaler-multiplier))
    }
}
.text-content{
    min-width:100%;
    width:calc(var(--width-percent) / var(--scaler))!important;
    height:calc(var(--width-percent) / var(--scaler))!important;
    transform:scale(calc(var(--scaler) / var(--scaler-multiplier)))!important;
    transform-origin:0 0
}
.text-content strong{
    font-weight:700
}
.text-content em{
    font-style:italic
}
.text-content{
    white-space:pre-wrap;
    word-break:break-word
}
.text-content p:empty:after{
    content:"\00A0"
}
.text-content ol,.text-content ul{
    padding-left:2.5em
}
.text-content ul li{
    list-style:disc
}
.text-content ol li{
    display:list-item;
    list-style-type:decimal
}
.text-content a{
    text-decoration:none
}
.text-content u{
    text-decoration:underline
}
