edit

public/1/img/(2) WhatsApp_files/lazy_loaded_high_priority_components.85a06e74a0a4ade1640b.css

@@ -0,0 +1,16 @@
+/*! Copyright (c) 2022 WhatsApp Inc. All Rights Reserved. */
+._2MjCA{flex:1 0 auto;width:82.5%;opacity:1;transition:transform 75ms ease-out,opacity .25s ease-in-out}._2MjCA:only-of-type{flex:none;width:100%}html[dir] ._2MjCA:only-of-type{margin:0 auto}html[dir=ltr] ._2MjCA+._2MjCA{margin-left:5px}html[dir=rtl] ._2MjCA+._2MjCA{margin-right:5px}._2cG76{position:relative;height:0}html[dir] ._2cG76{padding-top:125%}html[dir=ltr] ._2cG76:last-of-type{margin-right:0}html[dir=rtl] ._2cG76:last-of-type{margin-left:0}.ubkU5{position:absolute;top:0;bottom:0;z-index:100;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html[dir=ltr] .ubkU5,html[dir=rtl] .ubkU5{right:0;left:0}
+.alksS{position:relative;height:0}html[dir] .alksS{padding-top:100%}.OkAlG{position:absolute;top:0;display:flex;align-items:center;width:100%;height:100%;overflow:hidden}html[dir=ltr] .OkAlG{left:0}html[dir=rtl] .OkAlG{right:0}._1w5W1{overflow-x:auto;opacity:0}.j1J2j ._1w5W1{opacity:1}._2QkLV ._1w5W1{transition:opacity .2s ease-in-out}._1kDDe{justify-content:center}html[dir] ._1kDDe{background:var(--panel-background-deeper)}._3j4fM{opacity:0}
+.fkslc._18n4q{width:85px;height:85px}.IO4T6.ime-i{position:inherit}html[dir] .IO4T6.ime-i{background:none}._3OFgQ{line-height:25px}html[dir] ._3OFgQ{padding:0 20px 10px}
+._16mlH{position:relative;height:200px;overflow:hidden}html[dir] ._16mlH{background-color:var(--avatar-background)}._21sHs{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}._21sHs svg{width:100px;height:100px}._21sHs:after{position:absolute;top:0;z-index:100;width:100%;height:100%;content:""}html[dir] ._21sHs:after{background-color:rgba(var(--gray-800-rgb),.5)}html[dir=ltr] ._21sHs:after{left:0}html[dir=rtl] ._21sHs:after{right:0}._2lk6f{position:absolute;top:0;bottom:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center}html[dir] ._2lk6f{padding:0 30px;text-align:center}html[dir=ltr] ._2lk6f,html[dir=rtl] ._2lk6f{right:0;left:0}.pTNRM{font-weight:500}._2GV6F,.pTNRM{color:var(--inverse)}._2GV6F{display:-webkit-box;max-height:60px;overflow:hidden;line-height:20px;word-break:break-word;-webkit-line-clamp:3;-webkit-box-orient:vertical}html[dir] ._2GV6F{margin-top:12px}html[dir] .O1bTA{border-radius:0}._3i1KT{height:auto}html[dir] ._3i1KT{border-radius:0}
+._49vG{display:inline-block;font-size:14px}html[dir=ltr] ._49vG{padding:5px 5px 5px 0;margin-right:10px}html[dir=rtl] ._49vG{padding:5px 0 5px 5px;margin-left:10px}._2l3_Y{font-size:12px;line-height:8px}html[dir=ltr] ._2l3_Y{padding:8px 14px 8px 0}html[dir=rtl] ._2l3_Y{padding:8px 0 8px 14px}._2l3_Y svg{width:28px;height:22px}html[dir] ._2l3_Y svg{padding-top:1px}._1Nfyf{flex-wrap:wrap}html[dir] ._1Nfyf{margin-top:3px}html[dir] .DENbs{margin-top:0}
+html[dir] ._2v7h3{margin-top:16px}.f20SI{color:var(--teal)}
+._3KBDs{display:flex;align-content:center;align-items:center;justify-content:center}html[dir] ._3KBDs{margin:16px 0}._2ZlC0{position:relative}html[dir] ._2LUvK{padding:12px;background:#fff;border-radius:3px}._3TIEq{position:absolute;top:50%;z-index:2;width:30px;height:30px;color:#122e31;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html[dir] ._3TIEq{padding:2px;background:#fff}html[dir=ltr] ._3TIEq{left:50%;transform:translate(-50%,-50%)}html[dir=rtl] ._3TIEq{right:50%;transform:translate(50%,-50%)}
+._1yCy2{display:table-row;font-size:14px;color:var(--primary-muted)}._2n4C_{font-size:16px;color:var(--primary-stronger)}html[dir] ._1yCy2+._1yCy2 ._3E1wD,html[dir] ._1yCy2+._1yCy2 ._1KuI5{padding-top:8px}._3E1wD{display:table-cell;white-space:nowrap;vertical-align:top}html[dir=ltr] ._3E1wD{padding-right:15px}html[dir=rtl] ._3E1wD{padding-left:15px}._3QSVU{font-weight:500;color:var(--success)}._1KuI5{display:table-cell;width:100%;line-height:20px;white-space:pre-wrap;vertical-align:top}html[dir=ltr] ._1KuI5{padding-right:5px;text-align:right}html[dir=rtl] ._1KuI5{padding-left:5px;text-align:left}.tdvlj{display:table-cell;color:var(--icon-fixed);vertical-align:top}html[dir] .tdvlj{padding-top:4px}html[dir=ltr] .tdvlj{padding-left:4px}html[dir=rtl] .tdvlj{padding-right:4px}html[dir] ._3U46z{transform:scaleY(-1);transform-origin:50% 50%}
+._2piwD{font-size:16px;line-height:21px;color:var(--primary)}._2piwD a{color:var(--link-alt)}._3wQ4p{line-height:24px}html[dir] ._2piwD+._2piwD{margin:24px 0 0}.wjX1S{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}html[dir] .wjX1S{margin-bottom:8px}
+html[dir] ._-3uPc{margin-top:19px}html[dir=ltr] ._-3uPc{margin-left:-2px}html[dir=rtl] ._-3uPc{margin-right:-2px}.i0l32{display:flex;justify-content:center}html[dir] .i0l32{margin-top:24px;margin-bottom:12px}._27Am0{display:flex;align-items:flex-start}html[dir] ._27Am0{margin-bottom:14px}.pHhe2{display:table-row}html[dir] .pHhe2+.pHhe2 ._37D6O,html[dir] .pHhe2+.pHhe2 ._1Fkkg{padding-top:8px}._37D6O{display:table-cell;white-space:nowrap;vertical-align:top}html[dir=ltr] ._37D6O{padding-right:15px}html[dir=rtl] ._37D6O{padding-left:15px}._1Fkkg{display:table-cell;width:100%;white-space:pre-wrap;vertical-align:top}.PfSJW{display:table-cell;color:var(--icon-fixed);vertical-align:top}html[dir] .PfSJW{padding-top:4px}html[dir=ltr] .PfSJW{padding-left:4px}html[dir=rtl] .PfSJW{padding-right:4px}html[dir] .kphWe{transform:scaleY(-1);transform-origin:50% 50%}._1utXv{flex:none;width:24px;color:var(--icon-fixed)}html[dir=ltr] ._1utXv{margin-right:13px}html[dir=rtl] ._1utXv{margin-left:13px}._8jzcs{overflow:hidden;font-size:14px;line-height:20px}html[dir] ._8jzcs{padding-top:2px}._1_m2f{overflow:hidden;font-size:16px;line-height:20px}html[dir] ._1_m2f{padding-top:2px;cursor:pointer}.uTGlN{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}html[dir] .uTGlN{margin-bottom:8px}html[dir] ._3gira+.uTGlN{margin-top:8px}.sdA8C{word-wrap:anywhere}._2GuY5{color:var(--teal)}
+._3bmNw{position:absolute;top:0;width:100%;height:178px;overflow:hidden}html[dir=ltr] ._3bmNw{left:0}html[dir=rtl] ._3bmNw{right:0}html[dir] ._3bmNw._1k-Tj{background:var(--cover-image-background)}@media screen and (min-width:1024px){._3bmNw{height:164px}html[dir] ._3bmNw{padding-top:0}}@media screen and (min-width:1300px){._3bmNw{height:196px}html[dir] ._3bmNw{padding-top:0}}._1KIoW{position:relative;z-index:1000000;display:flex;justify-content:center;max-width:130px}html[dir] ._1KIoW{margin:57px auto 15px;background:none}@media screen and (min-width:1300px){html[dir] ._1KIoW{margin-top:66px}}html[dir] .kNRox{border:6px solid var(--drawer-section-background);border-radius:100%}html[dir] ._8N7c7{border:20px solid var(--drawer-section-background);border-radius:100%}.D-p9K{position:absolute;top:0;bottom:0}html[dir] .D-p9K{background-repeat:no-repeat;background-size:cover}html[dir=ltr] .D-p9K,html[dir=rtl] .D-p9K{right:0;left:0}
+.f3Dup{order:1}html[dir=ltr] .f3Dup{margin-right:18px}html[dir=rtl] .f3Dup{margin-left:18px}._2xUs5{flex:1;order:2}html[dir] ._2xUs5{cursor:auto}html[dir=ltr] ._2xUs5{margin-left:18px}html[dir=rtl] ._2xUs5{margin-right:18px}.Cq6XJ{box-sizing:border-box;display:flex;flex:1 0 auto;flex-direction:row;align-items:center;justify-content:space-between;height:calc(100% - 60px)}html[dir] .Cq6XJ{padding:10px 0}._1_TZb{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}._1_TZb,._3OWRM{width:100%;height:100%}._3OWRM{overflow:hidden}html[dir] ._3OWRM{background-repeat:no-repeat;background-position:50%;background-size:contain}html[dir=ltr] ._3OWRM{transform-origin:left top}html[dir=rtl] ._3OWRM{transform-origin:right top}._2hH_e{z-index:2;width:100%;height:100%}._9-YHG{z-index:500;display:flex;flex-direction:column}html[dir] ._9-YHG{background-color:rgba(var(--media-viewer-background-rgb),.96)}html[dir=ltr] ._9-YHG,html[dir=rtl] ._9-YHG{animation:_7DTuk .35s cubic-bezier(.1,.82,.25,1)}@keyframes _7DTuk{0%{opacity:0}to{opacity:1}}._1U_13{display:flex;flex:0 0 auto;flex-direction:row-reverse;align-items:center;height:60px;transition:visibility .3s,opacity .3s cubic-bezier(.1,.82,.25,1)}html[dir] ._1U_13{background-color:var(--media-viewer-background)}
+._3YiZC{position:relative;display:flex;max-width:100%}html[dir=ltr] ._3YiZC{padding-right:12px;padding-left:29px}html[dir=rtl] ._3YiZC{padding-left:12px;padding-right:29px}html[dir] .textsize-xxlarge ._3YiZC{margin-bottom:18px}html[dir] .textsize-xlarge ._3YiZC{margin-bottom:16px}html[dir] .textsize-large ._3YiZC{margin-bottom:14px}html[dir] .textsize-small ._3YiZC{margin-bottom:8px}html[dir] .textsize-xsmall ._3YiZC{margin-bottom:6px}html[dir] .textsize-xxsmall ._3YiZC{margin-bottom:4px}.RmpKn{box-sizing:border-box;display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html[dir=ltr] .RmpKn{padding:5px 4px 0 6px}html[dir=rtl] .RmpKn{padding:5px 6px 0 4px}.RmpKn a{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:top}.RmpKn a:hover{text-decoration:underline}._2z0p1{box-sizing:border-box}html[dir] ._2z0p1{padding:3px 3px 8px}html[dir=ltr] .XntIB{padding:3px 0 5px 6px}html[dir=rtl] .XntIB{padding:3px 6px 5px 0}html[dir] ._3bU-2 .XntIB{padding-bottom:0}html[dir] ._2cFHu ._2tYTz{margin-top:0}
+.nehFG._2OreO{z-index:3;width:300px;height:300px}html[dir] .nehFG._2OreO{background-color:var(--orange);background-position:50% 50%;background-size:cover}._1alR8{width:100%}@media screen and (min-width:800px){._1alR8{width:60%;max-width:660px}}
+._1XWMx{position:absolute;bottom:0;z-index:501;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;width:100%;height:100px;overflow:hidden;opacity:0;transition:visibility .3s,opacity .3s cubic-bezier(.1,.82,.25,1)}html[dir] ._1XWMx{border-top:1px solid var(--border-panel)}.img-zoomed-in ._1XWMx{visibility:hidden!important;opacity:0!important}._1MhXb{width:100%}._1FS45{display:flex;width:100%;overflow-x:scroll}html[dir] ._1FS45{padding-top:8px;padding-bottom:8px}._52crR{position:relative;box-sizing:border-box;display:flex;flex:0 0 auto;align-items:center;justify-content:center;width:5%;min-width:68px;max-width:78px;height:78px}html[dir=ltr] ._52crR{margin-right:8px}html[dir=rtl] ._52crR{margin-left:8px}._1833d{min-width:50%}

public/1/img/(2) WhatsApp_files/lazy_loaded_low_priority_components.8621270bc215a9298a97.css

@@ -0,0 +1,47 @@
+/*! Copyright (c) 2022 WhatsApp Inc. All Rights Reserved. */
+._2AkjL{position:relative;z-index:100;box-sizing:border-box;display:inline-block;flex:none;overflow:hidden;vertical-align:middle}html[dir] ._2AkjL{margin:8px 5px 10px;border:1px solid var(--media-editor-thumb-border);border-radius:5px}html[dir] ._2AkjL._31gut{margin:6px 3px 8px;border:3px solid var(--media-editor-thumb-border-active)}html[dir] ._2AkjL:hover{cursor:pointer}.keyboard-user ._2AkjL:focus{filter:brightness(.7)}._1iECW{overflow:hidden}html[dir] ._1iECW{background-color:var(--panel-background-deeper)}._1hZLd{position:relative;top:0;z-index:2;width:52px;height:52px}html[dir=ltr] ._1hZLd{left:0}html[dir=rtl] ._1hZLd{right:0}._1hZLd img{width:100%;height:100%;object-fit:cover;pointer-events:none}html[dir] ._1hZLd._299B_{background-repeat:no-repeat;background-position:50%;background-size:26px auto}._1hZLd:before{position:absolute;top:0;width:100%;height:40px;content:"";opacity:0;transition:opacity .1s ease-out}html[dir=ltr] ._1hZLd:before{right:0;background:linear-gradient(10deg,transparent,transparent 45%,rgba(var(--overlay-rgb),.18) 75%,rgba(var(--overlay-rgb),.4))}html[dir=rtl] ._1hZLd:before{left:0;background:linear-gradient(-10deg,transparent,transparent 45%,rgba(var(--overlay-rgb),.18) 75%,rgba(var(--overlay-rgb),.4))}._2AkjL:hover ._1hZLd:before{opacity:1}._2AkjL._31gut ._1hZLd:after{position:absolute;top:0;width:100%;height:100%;content:""}html[dir=ltr] ._2AkjL._31gut ._1hZLd:after{left:0}html[dir=rtl] ._2AkjL._31gut ._1hZLd:after{right:0}._1By33{position:absolute;top:1px;z-index:100;color:var(--inverse);opacity:0}html[dir=ltr] ._1By33{right:1px;transition:right 75ms ease-out,top 75ms ease-out}html[dir=rtl] ._1By33{left:1px;transition:left 75ms ease-out,top 75ms ease-out}._2AkjL:hover ._1By33{opacity:1}
+._388vZ{position:absolute;display:flex;align-items:center;justify-content:center;width:0;height:0}.ewANj{box-sizing:border-box}html[dir] .ewANj{border:solid #52f818;border-radius:5px}._1L8rJ{position:relative}._3tKNQ{position:absolute;color:#4a4a4a}html[dir=ltr] ._3tKNQ{left:50%}html[dir=rtl] ._3tKNQ{right:50%}html[dir] ._1F5dF{padding:2px;cursor:pointer;background-color:var(--white);border-radius:50%}html[dir] ._1F5dF:hover{background-color:var(--gray-100)}._3DCJ3{position:absolute;top:0;display:flex;align-items:stretch;justify-content:stretch;width:100%;height:100%}html[dir] ._3DCJ3{border-radius:6px}html[dir=ltr] ._3DCJ3{left:0}html[dir=rtl] ._3DCJ3{right:0}._269u7{box-sizing:border-box;white-space:pre-wrap;visibility:hidden}._3F7_-{white-space:pre}._39TQD{display:inline-block;width:18px;height:18px}
+._3gx1m{position:relative}._2mSFk{position:absolute;top:0;bottom:0}html[dir=ltr] ._2mSFk,html[dir=rtl] ._2mSFk{right:0;left:0}
+._2wtUo{box-sizing:border-box;display:flex;flex-direction:row;align-items:center;font-size:15px;line-height:15px}html[dir] ._2wtUo{padding:8px;cursor:pointer;border-radius:20px}html[dir] ._2wtUo._3z23o,html[dir] ._2wtUo:active,html[dir] ._2wtUo:hover{background-color:var(--menu-bar-item-background-active)}.wZyqj{opacity:.5}html[dir] .wZyqj._3z23o,html[dir] .wZyqj:active,html[dir] .wZyqj:hover{background:none}.ZZ0GN{width:24px;height:24px}html[dir=ltr] ._2X1cd{transform:rotate(180deg)}html[dir=rtl] ._2X1cd{transform:rotate(-180deg)}._2O4Bw{flex-grow:1;height:24px;line-height:24px}html[dir] ._2O4Bw{margin:0 4px;text-align:center}._104hn svg{width:15px;height:15px}
+._2J8i-{display:flex;flex-shrink:0;align-items:center;justify-content:center;width:28px;height:28px}html[dir] ._2J8i-{border-radius:50%}.fteqj{display:flex;align-items:center;justify-content:center;width:18px;height:18px}html[dir] .fteqj{border-radius:50%}.fteqj._1Rjww{width:20px;height:20px}._1H9V5{width:8px;height:8px}html[dir] ._1H9V5{border-radius:50%}html[dir] ._2J8i-._3Jsf_,html[dir] ._2J8i-._1jiBu{cursor:pointer}._2J8i-._3Jsf_ .fteqj,._2J8i-._1jiBu .fteqj{width:20px;height:20px}html[dir] ._2J8i-._1lanH._3Jsf_,html[dir] ._2J8i-._1lanH._1jiBu{cursor:default}._2J8i-._1lanH .fteqj{width:24px;height:24px}._2WYx6{box-sizing:border-box}html[dir] ._2WYx6{border:1px solid #5c5c5c}
+._3eK79{display:flex;align-items:center;min-width:0}._1E-L7{min-width:72px;overflow:hidden}
+html[dir] ._1LRKO>*{margin:0 8px}html[dir=ltr] ._3dKFO{margin-right:13px}html[dir=rtl] ._3dKFO{margin-left:13px}
+._1j1xr{box-sizing:border-box;display:block;height:40px;font-size:14.5px;line-height:14.5px;color:var(--primary);white-space:nowrap}html[dir] ._1j1xr{padding-top:13px;cursor:pointer}html[dir=ltr] ._1j1xr{padding-right:58px;padding-left:24px}html[dir=rtl] ._1j1xr{padding-left:58px;padding-right:24px}._2DKLD{position:absolute;top:7px}html[dir=ltr] ._2DKLD{right:24px}html[dir=rtl] ._2DKLD{left:24px}html[dir] ._106wS{margin-top:0}html[dir] ._1yqqW{margin-top:2px}html[dir] .bzq8z{margin-top:4px}html[dir=ltr] .bzq8z{margin-left:-3px}html[dir=rtl] .bzq8z{margin-right:-3px}._3Pj9c{font-size:24px}html[dir=ltr] ._3Pj9c{margin-left:-2px}html[dir=rtl] ._3Pj9c{margin-right:-2px}.ah3iR{font-size:20px}html[dir] .ah3iR{margin-top:-2px}._2lKFu{height:40px}html[dir] ._2lKFu{padding-top:9px;border-top:1px solid var(--border-stronger)}.mi3vs svg{opacity:.6}.mi3vs._1KlZW svg{opacity:1}
+.QUfeO{position:relative;flex-shrink:0}html[dir=ltr] ._3OMGG{padding-right:5px}html[dir=rtl] ._3OMGG{padding-left:5px}._3SJCV{width:20px;height:20px;font-size:13px;color:var(--media-editor-icon-secondary-color)}html[dir] ._3SJCV{text-align:center;background-color:var(--media-editor-icon-color);border-radius:50%}
+._10ZsU{position:relative;box-sizing:border-box;width:20px;height:20px}html[dir] ._10ZsU{border:2px solid var(--media-editor-icon-color);border-radius:50%}html[dir] ._10ZsU._1ZATr{background-color:var(--media-editor-icon-color)}._1B4g5{position:absolute;top:2px;width:calc(100% - 4px);height:calc(100% - 4px)}html[dir] ._1B4g5{border-radius:50%}html[dir=ltr] ._1B4g5{left:2px}html[dir=rtl] ._1B4g5{right:2px}._3s-4- svg{position:absolute;top:-1px;width:16px;height:16px;color:var(--media-editor-icon-secondary-color)}
+._1_bv-{display:flex}html[dir=ltr] ._1_bv-{margin:10px 8px 10px 20px}html[dir=rtl] ._1_bv-{margin:10px 20px 10px 8px}._3bAiP{display:flex;align-items:center;transition:background-color .12s ease-in-out}html[dir] ._3bAiP{padding:4px 5px;cursor:pointer}html[dir] ._3bAiP ._3iRrK{background-color:rgba(var(--media-editor-control-rgb),.3);border-radius:50%}html[dir] ._3bAiP:hover ._3iRrK{background-color:rgba(var(--media-editor-control-rgb),.5)}html[dir] ._3bAiP:active ._3iRrK{background-color:rgba(var(--media-editor-control-rgb),.35)}html[dir] ._3bAiP._32C9L ._3iRrK{background-color:rgba(var(--media-editor-control-rgb),1)}
+._34aQy{flex:1;flex-direction:column;overflow:hidden}._34aQy,.qAj2u{display:flex;justify-content:space-between}.qAj2u{align-items:center;height:56px}html[dir] .qAj2u{padding:8px 16px}._3PqRX{width:60px}._1PFn9{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;overflow:hidden}html[dir] ._1PFn9{margin:16px}html[dir] ._1PFn9._3zRbB{margin:6px}._1gvdP{width:60px}html[dir] ._1gvdP{cursor:pointer}._1Ao72{width:60px}._153i9{position:relative}html[dir] ._153i9{background:var(--background-default);box-shadow:0 3px 12px rgba(var(--shadow-rgb),.16)}._1nPzf{position:relative;min-height:56px}html[dir] ._1nPzf{padding:8px 0}html[dir] ._1nNuD>*{margin:0 8px}._1iQr1{width:100%}._1iQr1._6dYhh{display:none}
+.jcXC6{position:relative;display:flex;flex:1;flex-direction:column;justify-content:space-between;overflow:hidden}
+.JKr_m{position:relative;flex:1;width:100%}.JKr_m ._3R3yC{position:absolute;top:20px;display:flex;align-items:center;justify-content:center;width:calc(100% - 40px);height:calc(100% - 40px)}html[dir] .JKr_m ._3R3yC{background-repeat:no-repeat;background-position:50% 50%;background-size:contain}html[dir=ltr] .JKr_m ._3R3yC{left:20px}html[dir=rtl] .JKr_m ._3R3yC{right:20px}
+._3fFxj{position:relative;flex:1;width:100%}._3fFxj ._3lqv9{position:absolute;top:20px;display:flex;align-items:center;justify-content:center;width:calc(100% - 40px);height:calc(100% - 40px)}html[dir] ._3fFxj ._3lqv9{background-repeat:no-repeat;background-position:50% 50%;background-size:contain}html[dir=ltr] ._3fFxj ._3lqv9{left:20px}html[dir=rtl] ._3fFxj ._3lqv9{right:20px}._3fFxj .hH6sl{display:flex;flex:0 0 auto;flex-direction:column;align-items:center;align-self:center}._3fFxj .eAWMI{font-weight:300}._3fFxj .fDWKK{width:26px;height:30px}html[dir] ._3fFxj .fDWKK{margin-bottom:15px;background-repeat:no-repeat;background-size:contain}
+._2nVq-{box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:100%}html[dir] ._2nVq-{padding:20px}._2nVq- ._1K_xd{position:relative;flex:1 1 100%}._2nVq- ._3xLDc{flex:none}html[dir] ._2nVq- ._3xLDc{margin-top:20px;text-align:center}._2nVq- ._2zsdh{z-index:2;width:100%;height:100%}html[dir] ._2nVq- ._2zsdh._2Cuay{border:1px solid var(--gray-150);border-radius:8px;box-shadow:0 0 6px rgba(var(--shadow-rgb),.15)}
+._2SXhH{flex:1;flex-direction:column;justify-content:space-between;overflow:hidden}._2SXhH,.UJ-0N{position:relative;display:flex}.UJ-0N{z-index:300;align-items:center;justify-content:center;min-height:56px}html[dir] .UJ-0N{padding:8px 16px}
+._1ULgK{position:relative;flex:1;width:100%}._1ULgK ._2gN82{position:absolute;top:20px;display:flex;align-items:center;justify-content:center;width:calc(100% - 40px);height:calc(100% - 40px)}html[dir] ._1ULgK ._2gN82{background-repeat:no-repeat;background-position:50% 50%;background-size:contain}html[dir=ltr] ._1ULgK ._2gN82{left:20px}html[dir=rtl] ._1ULgK ._2gN82{right:20px}._1ULgK .OunMM{z-index:2;width:100%;height:100%}._1ULgK ._3ZDt1{min-width:250px}._33jN5{position:relative;display:flex;align-items:center;justify-content:center}._1-L7X{z-index:1000}._2Vd8_{position:absolute;top:0;z-index:10;width:100%;height:100%}html[dir=ltr] ._2Vd8_{left:0}html[dir=rtl] ._2Vd8_{right:0}.sWhPU{position:absolute;top:0;z-index:1;width:100%;height:100%}html[dir=ltr] .sWhPU{left:0}html[dir=rtl] .sWhPU{right:0}
+._1Mcu-{flex:1;min-width:500px;height:100%;min-height:400px;color:var(--media-editor-icon-color)}html[dir] ._1Mcu-{background-color:var(--panel-background-deeper)}html[dir=ltr] ._1Mcu-{border-left:1px solid var(--conversation-panel-border)}html[dir=rtl] ._1Mcu-{border-right:1px solid var(--conversation-panel-border)}html[dir] ._2NB7f{background-color:var(--background-default)}html[dir] ._1yFH0{background-color:var(--background-document-with-captions)}._1PdGl{position:absolute;z-index:1001;width:100%;height:100%}html[dir] ._1PdGl{background-color:rgba(var(--background-default-rgb),.6)}._2HexZ{box-sizing:border-box;display:flex;align-items:center;justify-content:center;height:calc(100% - 60px);font-size:30px;color:rgba(var(--primary-strong-rgb),.3)}html[dir] ._2HexZ{margin:30px;border:5px dashed rgba(var(--shadow-rgb),.3)}html[dir] .pzFG8{margin:auto}._1HI4Y{display:flex;flex:0 0 82px;align-items:center;justify-content:space-between}html[dir] ._1HI4Y{padding:8px 0;margin:0 16px;border-top:1px solid var(--border-stronger)}html[dir] ._1yFH0 ._1HI4Y{border-top:1px solid var(--border-document-footer)}._1xotB{display:flex;align-items:center;justify-content:center;width:52px;height:52px}html[dir] ._1xotB{margin:8px 5px;border:1px solid var(--gray-200);border-radius:5px}html[dir] .WAMhx{cursor:not-allowed}._1vAZI{box-sizing:border-box;flex:1 1 auto}html[dir] ._1vAZI{margin:4px 16px 0}._7Tfhi{flex:0 1 auto;min-width:0;overflow-x:scroll;white-space:nowrap}._33pCO{width:60px;height:60px}._1z1Aw{position:relative;height:16px}._1z1Aw ._33pCO{position:absolute;bottom:22px}html[dir=ltr] ._1z1Aw ._33pCO{right:16px}html[dir=rtl] ._1z1Aw ._33pCO{left:16px}
+._3lPuS{position:absolute;top:0;width:100%}html[dir=ltr] ._3lPuS{left:0}html[dir=rtl] ._3lPuS{right:0}._3I-Ax{position:relative;max-height:182px;overflow:auto}._2ERUw{position:absolute;bottom:0;box-sizing:border-box;width:100%}html[dir] ._2ERUw{background-color:var(--rich-text-panel-background);box-shadow:0 -5px 7px -5px rgba(var(--shadow-rgb),.05)}html[dir=ltr] ._2ERUw{left:0;border-left:1px solid var(--border-panel)}html[dir=rtl] ._2ERUw{right:0;border-right:1px solid var(--border-panel)}._2ERUw:before{position:absolute;top:0;bottom:0;z-index:2;pointer-events:none;content:""}html[dir] ._2ERUw:before{box-shadow:inset 0 -10px 9px -10px rgba(var(--shadow-rgb),.1)}html[dir=ltr] ._2ERUw:before,html[dir=rtl] ._2ERUw:before{right:0;left:0}._356RS{pointer-events:auto}html[dir] ._356RS{background-color:var(--rich-text-panel-background);box-shadow:0 2px 5px 0 rgba(var(--shadow-rgb),.26),0 2px 10px 0 rgba(var(--shadow-rgb),.16)}html[dir=ltr] ._356RS,html[dir=rtl] ._356RS{border-top-left-radius:3px;border-top-right-radius:3px}
+._49vG{display:inline-block;font-size:14px}html[dir=ltr] ._49vG{padding:5px 5px 5px 0;margin-right:10px}html[dir=rtl] ._49vG{padding:5px 0 5px 5px;margin-left:10px}._2l3_Y{font-size:12px;line-height:8px}html[dir=ltr] ._2l3_Y{padding:8px 14px 8px 0}html[dir=rtl] ._2l3_Y{padding:8px 0 8px 14px}._2l3_Y svg{width:28px;height:22px}html[dir] ._2l3_Y svg{padding-top:1px}._1Nfyf{flex-wrap:wrap}html[dir] ._1Nfyf{margin-top:3px}html[dir] .DENbs{margin-top:0}
+._3Q5hz{display:flex;align-items:center;overflow:hidden;text-overflow:ellipsis;white-space:normal}
+._13MJe{position:relative;display:flex;align-items:center}html[dir] ._13MJe{padding:16px 0;background-color:var(--background-default);border-top:1px solid var(--border-default)}._13MJe svg{width:18px;height:18px}.hM3sj{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}html[dir=ltr] .hM3sj{margin-left:3px}html[dir=rtl] .hM3sj{margin-right:3px}._1p9YY{color:var(--icon-lighter)}
+._1WEiG{position:absolute;top:0;z-index:2}html[dir] ._1WEiG{margin-top:-30px}html[dir=ltr] ._1WEiG{right:40px;left:auto}html[dir=rtl] ._1WEiG{left:40px;right:auto}._4yicW{flex:none;max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._1YZ48{position:relative;flex:1;justify-content:center;width:100%}._1nd00,._1YZ48{display:flex;align-items:center}._1nd00{flex-direction:column;max-height:57px;overflow:hidden;font-size:13px;line-height:19px}html[dir] ._1nd00{margin-top:6px;text-align:center}.iajo1{position:relative;z-index:3;box-sizing:border-box;display:flex;align-items:center;justify-content:center;min-height:90px}html[dir] .iajo1{padding:0 20px 6px}._3rPvK{position:absolute;top:0;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;width:100%;height:100%}html[dir] ._3rPvK{background-color:var(--panel-background-deep)}html[dir=ltr] ._3rPvK{left:0}html[dir=rtl] ._3rPvK{right:0}._3r-Fa{display:flex;align-items:center;color:inherit}html[dir] ._3r-Fa{cursor:pointer}html[dir] .keyboard-user button:focus{border-radius:2px;box-shadow:0 0 0 2px rgba(var(--focus-rgb),.5)}._3SS26{flex:none;color:var(--inverse)}html[dir=ltr] ._3SS26{margin-right:4px}html[dir=rtl] ._3SS26{margin-left:4px}._3ULIF{display:flex;align-items:center;justify-content:center}html[dir] ._3ULIF{background-repeat:no-repeat;background-position:50% 50%;background-size:contain}._38bBM{position:absolute;top:0;bottom:0}html[dir=ltr] ._38bBM,html[dir=rtl] ._38bBM{right:0;left:0}._1TwXp{flex:1}html[dir=ltr] ._1TwXp{text-align:left}html[dir=rtl] ._1TwXp{text-align:right}
+._2136P{z-index:2;max-height:50%;overflow-y:auto}html[dir] ._2136P{margin-top:-25px;background:var(--location-cluster-background);box-shadow:inset 0 47px var(--teal);transform:translateZ(0)}.C1Dd9{width:100%}html[dir] .C1Dd9{background-color:var(--background-default)}.K1c_P{color:var(--white)}.K1c_P,._16f8P{display:flex;flex-direction:row;height:48px}html[dir] ._16f8P{cursor:pointer;background-color:var(--location-cluster-background)}html[dir] ._16f8P .DMk3i{border-top:1px solid var(--border-default)}._1mO8w{display:flex;align-items:center;width:28px;height:28px}html[dir=ltr] ._1mO8w{padding:10px 15px 10px 13px}html[dir=rtl] ._1mO8w{padding:10px 13px 10px 15px}.DMk3i{display:flex;flex-grow:1;align-items:center}html[dir=ltr] .DMk3i{padding-right:15px}html[dir=rtl] .DMk3i{padding-left:15px}._38Gu8{color:var(--inverse)}html[dir] ._38Gu8{margin:0 2px;cursor:pointer}._2z4ea{display:flex;flex-grow:1;overflow:hidden;font-size:15px;line-height:32px;color:var(--primary-strong)}html[dir=ltr] ._2z4ea{text-align:left}html[dir=rtl] ._2z4ea{text-align:right}._4VLPt{display:flex;font-size:13px;color:var(--secondary-lighter)}html[dir=ltr] ._4VLPt{margin-left:6px}html[dir=rtl] ._4VLPt{margin-right:6px}
+._26J0I{position:relative;display:flex;flex:1;flex-direction:column;width:100%}._2ZG5x,.Pc7bU{position:absolute;z-index:1000;display:flex;align-items:center;justify-content:center;width:100%;height:100%}html[dir] ._2ZG5x,html[dir] .Pc7bU{text-align:center}html[dir] ._2ZG5x{cursor:pointer;background-color:rgba(var(--panel-background-rgb),.7)}html[dir] .Pc7bU{background-color:rgba(var(--panel-background-rgb),.9)}._1487t{width:50px;height:50px;line-height:50px;color:var(--inverse)}html[dir] ._1487t{padding:35px;margin:0 auto 35px;text-align:center;border-radius:50%}._2WNWn{line-height:normal}html[dir] ._2WNWn{margin:0 20px}html[dir] ._2ZG5x ._1487t{background-color:rgba(var(--teal-rgb),.6)}._2ZG5x ._2WNWn{color:var(--teal)}html[dir] .Pc7bU ._1487t{background-color:var(--white)}.Pc7bU ._2WNWn{color:var(--secondary)}._1487t svg{width:50px;height:50px}._3LWZ9{position:absolute;top:100px;z-index:2;color:var(--icon-fixed);visibility:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html[dir] ._3LWZ9{padding:6px;cursor:pointer;background-color:var(--white);border-radius:2px;box-shadow:rgba(var(--shadow-rgb),.3) 0 1px 4px -1px}html[dir=ltr] ._3LWZ9{right:10px}html[dir=rtl] ._3LWZ9{left:10px}._3LWZ9 svg{width:28px;height:28px}._3LWZ9._2Ozk7{visibility:visible}
+._2BPRJ{display:flex;flex:1;width:100%;height:100%}._312iE{flex-direction:column;flex-grow:1}html[dir] ._312iE>div{background-color:var(--blue-ocean)!important}.xgGDH,.L5P7F{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.xgGDH{color:var(--danger)}
+._2RE0a{position:relative;overflow:hidden}html[dir] ._2RE0a{background-color:var(--avatar-background);border-radius:50%}html[dir] ._2RE0a._3t6bN{border:2px solid var(--white)}html[dir] ._2RE0a._36Gk7{border-radius:0}._1b8fw{overflow:hidden}._1b8fw,._1gLP4{position:absolute}._1gLP4{top:0;z-index:200;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:lighter;color:var(--inverse)}html[dir] ._1gLP4{text-align:center;background-color:rgba(var(--overlay-rgb),.25)}html[dir=ltr] ._1gLP4{left:0}html[dir=rtl] ._1gLP4{right:0}html[dir=ltr] ._1EzI5 .JOgRb{left:-50%}html[dir=rtl] ._1EzI5 .JOgRb{right:-50%}html[dir=ltr] ._1EzI5 .JOgRb>div{left:25%}html[dir=rtl] ._1EzI5 .JOgRb>div{right:25%}html[dir=ltr] ._1EzI5 ._3Q0g1{right:-50%}html[dir=rtl] ._1EzI5 ._3Q0g1{left:-50%}html[dir=ltr] ._1EzI5 ._3Q0g1>div{right:25%}html[dir=rtl] ._1EzI5 ._3Q0g1>div{left:25%}html[dir=ltr] ._33l2L .JOgRb{left:-50%}html[dir=rtl] ._33l2L .JOgRb{right:-50%}html[dir=ltr] ._33l2L .JOgRb>div{left:25%}html[dir=rtl] ._33l2L .JOgRb>div{right:25%}._33l2L ._3Q0g1{top:-50%}html[dir=ltr] ._33l2L ._3Q0g1{right:-50%}html[dir=rtl] ._33l2L ._3Q0g1{left:-50%}._33l2L ._3Q0g1>div{top:25%}html[dir=ltr] ._33l2L ._3Q0g1>div{right:25%}html[dir=rtl] ._33l2L ._3Q0g1>div{left:25%}._33l2L ._1MivT{bottom:-50%}html[dir=ltr] ._33l2L ._1MivT{right:-50%}html[dir=rtl] ._33l2L ._1MivT{left:-50%}._33l2L ._1MivT>div{bottom:25%}html[dir=ltr] ._33l2L ._1MivT>div{right:25%}html[dir=rtl] ._33l2L ._1MivT>div{left:25%}._18BoY .JOgRb{top:-50%}html[dir=ltr] ._18BoY .JOgRb{left:-50%}html[dir=rtl] ._18BoY .JOgRb{right:-50%}._18BoY .JOgRb>div{top:25%}html[dir=ltr] ._18BoY .JOgRb>div{left:25%}html[dir=rtl] ._18BoY .JOgRb>div{right:25%}._18BoY ._3Q0g1{bottom:-50%}html[dir=ltr] ._18BoY ._3Q0g1{left:-50%}html[dir=rtl] ._18BoY ._3Q0g1{right:-50%}._18BoY ._3Q0g1>div{bottom:25%}html[dir=ltr] ._18BoY ._3Q0g1>div{left:25%}html[dir=rtl] ._18BoY ._3Q0g1>div{right:25%}._18BoY ._1MivT{top:-50%}html[dir=ltr] ._18BoY ._1MivT{right:-50%}html[dir=rtl] ._18BoY ._1MivT{left:-50%}._18BoY ._1MivT>div{top:25%}html[dir=ltr] ._18BoY ._1MivT>div{right:25%}html[dir=rtl] ._18BoY ._1MivT>div{left:25%}._18BoY ._1P7KC{bottom:-50%}html[dir=ltr] ._18BoY ._1P7KC{right:-50%}html[dir=rtl] ._18BoY ._1P7KC{left:-50%}._18BoY ._1P7KC>div{bottom:25%}html[dir=ltr] ._18BoY ._1P7KC>div{right:25%}html[dir=rtl] ._18BoY ._1P7KC>div{left:25%}
+._3rs7K{position:relative;z-index:999}._10G_J{z-index:1000}html[dir] .h5TUN{cursor:pointer;background-color:var(--live-location-glow);border-radius:50%}html[dir] .h5TUN._3WyhQ{background-color:var(--live-location-glow-stale)}html[dir] .h5TUN._1HO_K{background:none}html[dir] ._2JeQm{background-color:var(--white);border-radius:50%}html[dir=ltr] ._2JeQm{box-shadow:-5px 0 10px 1px var(--shadow-rgb),5px 0 10px 1px var(--shadow-rgb)}html[dir=rtl] ._2JeQm{box-shadow:5px 0 10px 1px var(--shadow-rgb),-5px 0 10px 1px var(--shadow-rgb)}html[dir] ._2JeQm._10G_J{background-color:var(--highlight)}
+html[dir] ._1O7kH{padding:10px;background-color:var(--modal-background);border-radius:3px}._1qWAL{position:absolute;top:-50px;z-index:1000;min-width:150px;max-width:330px;filter:drop-shadow(0 0 5px rgba(var(--shadow-rgb),.25))}html[dir] ._1qWAL{cursor:default}._1qWAL._2dn9y{top:-70px}._2UN5N{overflow-x:hidden;font-size:15px;text-overflow:ellipsis}html[dir=ltr] ._2UN5N{margin-right:25px}html[dir=rtl] ._2UN5N{margin-left:25px}._1fM0V{font-size:12px;color:var(--secondary)}html[dir] ._1fM0V{margin-top:4px}html[dir=ltr] ._1fM0V{margin-right:25px}html[dir=rtl] ._1fM0V{margin-left:25px}._2UenO{position:absolute;top:8px;width:18px;height:18px;color:var(--icon);opacity:.8}html[dir] ._2UenO{cursor:pointer}html[dir=ltr] ._2UenO{right:5px;padding-right:3px;padding-left:3px}html[dir=rtl] ._2UenO{left:5px;padding-left:3px;padding-right:3px}._1NoUg{width:0;height:0}html[dir] ._1NoUg{margin:auto;border-top:10px solid var(--white)}html[dir=ltr] ._1NoUg,html[dir=rtl] ._1NoUg{border-right:10px solid transparent;border-left:10px solid transparent}
+.D0Q5P{width:100%;max-height:50%;overflow-y:auto}html[dir] .D0Q5P{margin-top:-25px;background-color:var(--background-default);border-top:1px solid var(--border-stronger)}._8wYL{font-size:14px;color:var(--danger)}
+._9Gs_R{position:relative;flex:1;flex-direction:column}._3rEcJ,._9Gs_R{display:flex;width:100%}._3rEcJ{position:absolute;z-index:1000;align-items:center;justify-content:center;height:100%}html[dir] ._3rEcJ{text-align:center;background-color:rgba(var(--panel-background-rgb),.9)}._2Xn1u{width:50px;height:50px;line-height:50px}html[dir] ._2Xn1u{padding:35px;margin:0 auto 35px;text-align:center;background-color:var(--white);border-radius:50%}._1nFpn{font-size:18px;line-height:24px;color:var(--secondary)}html[dir] ._1nFpn{margin:0 20px}._2Xn1u svg{width:50px;height:50px}.p9CjV{position:absolute;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:62px}html[dir] .p9CjV{text-align:center;background-color:var(--live-location-footer-background);box-shadow:0 -2px 4px rgba(var(--shadow-rgb),.05)}._2OrJW{font-size:15px;color:var(--danger)}._3VPfk{font-size:14px;color:var(--secondary-lighter)}html[dir] ._3VPfk{margin-top:7px}
+.bSJ6w path.background{fill:transparent}.bSJ6w path.primary{fill:#fff}
+._3uMAp{position:relative;flex-grow:1}._1WX5F{position:absolute;top:0;bottom:0;display:flex;flex-flow:row wrap;justify-content:center;overflow-y:scroll}html[dir=ltr] ._1WX5F{padding:30px 20px 30px 30px}html[dir=rtl] ._1WX5F{padding:30px 30px 30px 20px}.MkTEt{position:relative;width:133px;height:133px}html[dir] .MkTEt{margin-bottom:10px;cursor:pointer}html[dir=ltr] .MkTEt{margin-right:10px}html[dir=rtl] .MkTEt{margin-left:10px}._2ppZW{width:133px}._6CxGV{width:100%;height:100%}._7mUkD{position:absolute;top:0;box-sizing:border-box;display:block;width:100%;height:100%;pointer-events:none}html[dir] ._7mUkD{background-color:rgba(var(--white-rgb),0)}html[dir=ltr] ._7mUkD{left:0}html[dir=rtl] ._7mUkD{right:0}html[dir] ._1KnO5 ._7mUkD{border:7.98px solid var(--panel-background)}.PYlBE{display:flex;align-items:center;justify-content:center;width:100%}html[dir] .PYlBE{margin-top:24px}@keyframes _3i50e{50%{opacity:.5}}html[dir=ltr] ._30mp5,html[dir=rtl] ._30mp5{animation-name:_3i50e;animation-duration:.3s;animation-timing-function:cubic-bezier(.24,.91,.01,.99)}
+.f3Dup{order:1}html[dir=ltr] .f3Dup{margin-right:18px}html[dir=rtl] .f3Dup{margin-left:18px}._2xUs5{flex:1;order:2}html[dir] ._2xUs5{cursor:auto}html[dir=ltr] ._2xUs5{margin-left:18px}html[dir=rtl] ._2xUs5{margin-right:18px}.Cq6XJ{box-sizing:border-box;display:flex;flex:1 0 auto;flex-direction:row;align-items:center;justify-content:space-between;height:calc(100% - 60px)}html[dir] .Cq6XJ{padding:10px 0}._1_TZb{position:relative;display:flex;align-items:center;justify-content:center;min-width:0}._1_TZb,._3OWRM{width:100%;height:100%}._3OWRM{overflow:hidden}html[dir] ._3OWRM{background-repeat:no-repeat;background-position:50%;background-size:contain}html[dir=ltr] ._3OWRM{transform-origin:left top}html[dir=rtl] ._3OWRM{transform-origin:right top}._2hH_e{z-index:2;width:100%;height:100%}._9-YHG{z-index:500;display:flex;flex-direction:column}html[dir] ._9-YHG{background-color:rgba(var(--media-viewer-background-rgb),.96)}html[dir=ltr] ._9-YHG,html[dir=rtl] ._9-YHG{animation:_7DTuk .35s cubic-bezier(.1,.82,.25,1)}@keyframes _7DTuk{0%{opacity:0}to{opacity:1}}._1U_13{display:flex;flex:0 0 auto;flex-direction:row-reverse;align-items:center;height:60px;transition:visibility .3s,opacity .3s cubic-bezier(.1,.82,.25,1)}html[dir] ._1U_13{background-color:var(--media-viewer-background)}
+._2MjCA{flex:1 0 auto;width:82.5%;opacity:1;transition:transform 75ms ease-out,opacity .25s ease-in-out}._2MjCA:only-of-type{flex:none;width:100%}html[dir] ._2MjCA:only-of-type{margin:0 auto}html[dir=ltr] ._2MjCA+._2MjCA{margin-left:5px}html[dir=rtl] ._2MjCA+._2MjCA{margin-right:5px}._2cG76{position:relative;height:0}html[dir] ._2cG76{padding-top:125%}html[dir=ltr] ._2cG76:last-of-type{margin-right:0}html[dir=rtl] ._2cG76:last-of-type{margin-left:0}.ubkU5{position:absolute;top:0;bottom:0;z-index:100;width:100%;height:100%;object-fit:cover;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html[dir=ltr] .ubkU5,html[dir=rtl] .ubkU5{right:0;left:0}
+.alksS{position:relative;height:0}html[dir] .alksS{padding-top:100%}.OkAlG{position:absolute;top:0;display:flex;align-items:center;width:100%;height:100%;overflow:hidden}html[dir=ltr] .OkAlG{left:0}html[dir=rtl] .OkAlG{right:0}._1w5W1{overflow-x:auto;opacity:0}.j1J2j ._1w5W1{opacity:1}._2QkLV ._1w5W1{transition:opacity .2s ease-in-out}._1kDDe{justify-content:center}html[dir] ._1kDDe{background:var(--panel-background-deeper)}._3j4fM{opacity:0}
+.fkslc._18n4q{width:85px;height:85px}.IO4T6.ime-i{position:inherit}html[dir] .IO4T6.ime-i{background:none}._3OFgQ{line-height:25px}html[dir] ._3OFgQ{padding:0 20px 10px}
+._16mlH{position:relative;height:200px;overflow:hidden}html[dir] ._16mlH{background-color:var(--avatar-background)}._21sHs{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%}._21sHs svg{width:100px;height:100px}._21sHs:after{position:absolute;top:0;z-index:100;width:100%;height:100%;content:""}html[dir] ._21sHs:after{background-color:rgba(var(--gray-800-rgb),.5)}html[dir=ltr] ._21sHs:after{left:0}html[dir=rtl] ._21sHs:after{right:0}._2lk6f{position:absolute;top:0;bottom:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center}html[dir] ._2lk6f{padding:0 30px;text-align:center}html[dir=ltr] ._2lk6f,html[dir=rtl] ._2lk6f{right:0;left:0}.pTNRM{font-weight:500}._2GV6F,.pTNRM{color:var(--inverse)}._2GV6F{display:-webkit-box;max-height:60px;overflow:hidden;line-height:20px;word-break:break-word;-webkit-line-clamp:3;-webkit-box-orient:vertical}html[dir] ._2GV6F{margin-top:12px}html[dir] .O1bTA{border-radius:0}._3i1KT{height:auto}html[dir] ._3i1KT{border-radius:0}
+._2V4Ys{overflow:hidden}html[dir] ._2V4Ys{padding-bottom:8px}html[dir] ._2V4Ys._82KlQ{margin-top:8px}
+._3bmNw{position:absolute;top:0;width:100%;height:178px;overflow:hidden}html[dir=ltr] ._3bmNw{left:0}html[dir=rtl] ._3bmNw{right:0}html[dir] ._3bmNw._1k-Tj{background:var(--cover-image-background)}@media screen and (min-width:1024px){._3bmNw{height:164px}html[dir] ._3bmNw{padding-top:0}}@media screen and (min-width:1300px){._3bmNw{height:196px}html[dir] ._3bmNw{padding-top:0}}._1KIoW{position:relative;z-index:1000000;display:flex;justify-content:center;max-width:130px}html[dir] ._1KIoW{margin:57px auto 15px;background:none}@media screen and (min-width:1300px){html[dir] ._1KIoW{margin-top:66px}}html[dir] .kNRox{border:6px solid var(--drawer-section-background);border-radius:100%}html[dir] ._8N7c7{border:20px solid var(--drawer-section-background);border-radius:100%}.D-p9K{position:absolute;top:0;bottom:0}html[dir] .D-p9K{background-repeat:no-repeat;background-size:cover}html[dir=ltr] .D-p9K,html[dir=rtl] .D-p9K{right:0;left:0}
+._1GBQ2{display:flex;flex-direction:column;width:500px;height:325px}html[dir] ._1GBQ2{padding:6px}._2ORz2{flex-grow:1;overflow-y:auto}._1DFmp{display:flex;align-items:center;font-size:16px}html[dir] ._2pPkR{padding:19px 24px}._1NGCs{flex:1}html[dir] ._1NGCs{padding:13px 0;cursor:pointer}._1NGCs.YVobU{color:var(--label-disabled-text)}._2-B6b{display:flex;align-items:center;justify-content:center;height:100%}html[dir] ._2-B6b{padding:0}html[dir] ._1Fb5R{background-color:var(--rich-text-panel-background)}
+._3PMWi svg{width:24px;height:24px}html[dir] div._3PMWi{margin-top:-2px}html[dir] ._23GE5{padding-top:0}
+.khEuM{opacity:.7}._3e7DF{display:inherit;overflow:inherit;text-overflow:inherit;white-space:inherit}._3OVY5{display:inline-block;flex:0 0 auto;vertical-align:top}html[dir] ._3OVY5{margin-top:1px}html[dir=ltr] ._3OVY5{margin-left:3px}html[dir=rtl] ._3OVY5{margin-right:3px}
+._2BtE_{box-sizing:border-box}html[dir] ._2BtE_{padding:24px 36px}._2Tvyf{display:flex;flex-direction:column;max-height:480px;overflow:auto;white-space:pre-wrap}html[dir] ._2Tvyf{margin-top:24px}@media (max-width:1023px){._2Tvyf{box-sizing:border-box;width:440px}}@media (min-width:1024px){._2Tvyf{flex-flow:row wrap;width:840px}}@media screen and (max-height:750px){._2Tvyf{max-height:350px}}.HYKvS{display:flex;align-items:center;justify-content:center;width:328px;min-height:100px}html[dir] .HYKvS{margin-top:25px}
+html[dir] ._1TOgh{margin:0 0 14px}._1vfS7{display:flex;flex-wrap:wrap}._2a_Q7{position:relative;display:inline-block;width:128px;height:131px}html[dir=ltr] ._2a_Q7{margin:0 8px 10px 0}html[dir=rtl] ._2a_Q7{margin:0 0 10px 8px}html[dir] ._2a_Q7:focus{box-shadow:0 0 0 2px rgba(var(--blue-light-rgb),.4)}html[dir=ltr] ._1vfS7>:nth-child(3n){margin-right:0}html[dir=rtl] ._1vfS7>:nth-child(3n){margin-left:0}.Cbc-m{width:100%;pointer-events:none}._2WYev svg{width:30px;height:30px}._1ar7j{position:relative;display:inline-block;width:128px;height:131px;color:#3d7a99;vertical-align:top}html[dir] ._1ar7j{background-color:var(--button-primary);border-radius:4px}html[dir=ltr] ._1ar7j{margin:0 8px 10px 0}html[dir=rtl] ._1ar7j{margin:0 0 10px 8px}html[dir] .RAMrK{margin-top:5px;text-align:center}._3E49Y{width:100%;min-height:16px;color:var(--danger)}

public/buy/index.html

@@ -170,14 +170,21 @@
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page2
                         </a>
                         <div class="relative">
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page3
                         </a>
                         <div class="relative">
@@ -211,14 +218,21 @@
                              
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page2
                             </a>
                             <hr/>
                         
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page3
                             </a>
                             <hr/>
@@ -399,7 +413,7 @@ Parameters:
 
                     
                         
-<p><img src="https://examplezola.tf/page3/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
+<p><img src="https://examplezola.tf/buy/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
 
                     
                 </div>

public/home/img/OURPHONE - Product Intro Preso - 2022.12.txt

@@ -0,0 +1,266 @@
+ULTIMATE
+SOVEREIGNTY
+
+
+ 
+
+
+
+
+
+secure every click with the world’s first truly decentralized mobile phone. 
+
+
+
+
+SECURE EVERY CLICK
+
+ 
+
+
+
+
+
+Every inch of every application is fully encrypted on the OurPhone.  Have no concerns about your data being manipulated or stolen.
+
+
+
+
+QUANTUM SAFE STORAGE
+
+
+When you subscribe to the OurPhone applications, you automatically receive gigantic decentralized storage space.
+
+
+
+FULLY LOADED
+
+
+The OurPhone already comes with numerous applications and more are becoming available very soon.
+
+
+
+OWN YOUR DATA
+
+
+Only you are the sole owner of your data and not large tech companies.
+
+
+
+
+ACCESS EDGE COMPUTING
+
+
+Experience unparalleled speeds due to the latest edge cloud technology.
+
+
+
+PLANETARY SECURE CONNECTIONS
+
+
+Any transfer of data or communication between parties is completely private and fully secure.
+
+
+
+DECENTRALIZED
+
+
+Every application on the OurPhone is hosted on a decentralized network.
+
+
+
+
+FULLY SECURE & PRIVATE APPS
+
+ 
+
+
+
+
+
+An abundance of features and applications are available to you.
+
+
+
+
+POWERED BY THREEFOLD 
+
+ 
+
+
+
+
+
+The world’s largest decentralized network by ThreeFold allows  every application on the OurPhone to attain a level of security and privacy never seen before.
+
+
+
+https://www.threefold.io/
+
+Based on Google Pixel 6a, 7 and 7 Pro
+Super powerful hardware platform.
+Graphene OS (Android without Google)
+ThreeFold Quantum Safe Storage System
+ThreeFold Planetary network
+ThreeFold Edge Compute
+OurVerse Platform (federated alternatives on twitter, whatsapp, zoom, facebook, youtube, soundcloud, protonmail, …) 
+FreeFlow Twin (digital twin technology)
+Secure compatibility layer with Android apps
+
+
+
+
+OURPHONE
+
+Matte enclosure made from 100% recycled aluminum
+25% brighter outdoors, even in sunlight
+fast and responsive display
+
+Y
+X
+A
+OURPHONE
+
+THE SPECS
+• Screen size: 6.1-inches 1080 x 2400 OLED 
+• Resolution: FHD+     (1080 x 2400 pixels) OLED 
+• Operating system: Android 12 
+• Processor: Google Tensor 
+• Cameras: 12.2 MP wide,     12 MP ultra-wide, 8MP selfie 
+• Battery: 4410 mAh 
+• Storage: 128 GB, RAM: 6 GB 
+• Weight: 178 g 
+• Water resistance: IP67 
+
+
+
+OURPHONE A
+• Screen: 6.71-inches 1440x3120 OLED
+    Corning Gorilla Glass
+• 2 SIM Cards
+• Operating system: Graphene OS 
+• Processor: Google Tensor G2 (4 nm), Octa-core       (2x2.85 GHz Cortex-X1 & 2x2.35 GHz     Cortex-A76 & 4x1.80 GHz Cortex-A55) 
+• Cameras: 50 MP wide, Laser Focus,      Laser AF, OIS, 48 MP, f/3.5, 104mm
+• Battery: 4410 mAh  ???
+• Storage: 256 GB, RAM: 12 GB 
+• Weight: 178 g  ???
+• Water resistance: IP67 
+
+
+
+OURPHONE Y
+OURPHONE X
+• Screen: 6.3-inches 1440x3120 OLED
+    Corning Gorilla Glass
+• 2 SIM Cards
+• Operating system: Graphene OS 
+• Processor: Google Tensor G2 (4 nm),     Octa-core   (2x2.85 GHz Cortex-X1 &     2x2.35 GHz,  Cortex-A76 & 4x1.80 GHz     Cortex-A55) 
+• Cameras: 50 MP wide, Laser Focus,      Laser AF, OIS, 48 MP, f/3.5, 104mm
+• Battery: 4410 mAh  ???
+• Storage: 256 GB, RAM: 12 GB 
+• Weight: 178 g  ???
+• Water resistance: IP67 
+
+
+
+
+PRE-SALE
+
+ 
+
+
+
+
+
+OURPHONE HW A/X/Y 
+USD 300 … 899 (*)OURPHONE PLATFORM 
+SETUP: 240 USDMONTHLY: 20 USD (first 6 months free)
+
+
+
+
+
+TRANSPARENT PRICING
+ (*)  We do our best to acquire the phone as cost effective as possible.         Your cost will be our cost (hardware, logistics, transport).
+        You can even buy the phone yourself and we provide our installer.
+
+PRESALE STARTS CHRISTMASMINIMAL NR OF PHONES = 1,000
+
+
+COMMUNITY DEVELOPMENT BUILD 
+3 months after conclusion of pre-sale.
+For developers & Partners
+Help us develop.
+Preview of features
+GENERIC AUDIENCE
+goal: 6 months after pre-sale
+
+
+
+
+TOGETHER
+
+a new internet needs to be created together.
+
+CROWD FUNDED
+
+ 
+
+
+
+
+
+Contact us if you want to co-own the OurPhone Company
+
+OurPhone Company is 
+
+40% community (crowd funding)
+40% threefold (technology provider)
+20% team
+
+333,000 shares, 1 share = price of 1 gram of gold = today 58 USDMin shares to acquire = 999. Investors have priority on exit.Each share will be on a blockchain as security token. The OurPhone treasury (funds) are all kept as gold.
+
+PROTECT YOUR WEALTH
+
+ 
+
+
+
+
+
+Finance our stock of phones & 3nodes (in UAE).
+
+We want to acquire 2m USD worth of phones and compute/storage devices (to build infrastructure).Your investment is backed by the stock.Is structured as convertible loan (5%).
+
+Additional advantage, your financing of OurPhone stock gives you 50% discount in our crowd funding for the amount financed.e.g if you invest 100,000 USD in for ourphone stockyou can buy another 100,000 USD worth of shares at 50% discount.
+
+
+
+THE MOST SOVEREIGN PHONE IN THE WORLD.
+
+
+
+POWERED BY THREEFOLD 
+
+BE YOUR INTERNET
+GRAPHENE OS
+
+SECURE OPENSOURCE OPERATING SYSTEMINTEGRATED AND CUSTOMIZED BY OURPHONE TEAM.
+OURVERSEAPPS
+THREEFOLD DECENTRALIZED INTERNET
+
+QUANTUM SAFE STORAGE SYSTEMPLANETARY SECURE NETWORKEDGE COMPUTE CLOUD
+OURVERSE
+
+ALTERNATIVES FOR WHATSAPP, GMAIL, OFFICE365, TWITTER, YOUTUBE, SOUNDCLOUD, ZOOM,  …BASED ON PROVEN OPENSOURCE FEDIVERSE PROJECTS 	(+60,000,000 users today)
+
+GRAPHENE OS
+The private and secure mobile operating system with Android app compatibility. Developed as a non-profit open source project.
+
+ThreeFold provides the Ourverse Application Platform running on top of the decentralized ThreeFold Grid. Have access to a full sovereign private internet life.
+
+No Google Apps or Play services inside. It's possible to install android apps via our sandboxed Google Play compatibility layer. BE YOUR INTERNET
+
+Y
+X
+A

public/home/index.html

@@ -170,14 +170,21 @@
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page2
                         </a>
                         <div class="relative">
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page3
                         </a>
                         <div class="relative">
@@ -211,14 +218,21 @@
                              
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page2
                             </a>
                             <hr/>
                         
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page3
                             </a>
                             <hr/>
@@ -368,9 +382,9 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h1 id="text-8xl">TITLE</h1>
-<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.<br> Quas, aliquid ab blanditiis omnis odio repellat?</p>
-<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
+                        <h1 id="text-8xl">MyTrunk</h1>
+<p>My trunk is an idea that a good friend and I had a long time ago. This was at the start of the whole .com boom where everyone that had an idea got millions to execute on it. Many of these initial ideas failed, some of them became the monopolies of today, Google, Facebook and Amazon. We never launched the mytrunk.com domain and this site is an ode to that lost opportunity in which I organize my daily online life.</p>
+<p><button><a href="https://examplezola.tf/">Like!</a></button></p>
 
                     
                 </div>
@@ -532,7 +546,7 @@ Parameters:
 
                     
                         <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-2-1"><strong>SECTION 2.1</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -548,7 +562,7 @@ Parameters:
                     
                         
 <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-2-2"><strong>SECTION 2.2</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -564,7 +578,7 @@ Parameters:
                     
                         
 <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title-2"><strong>TITLE</strong></h3>
+<h3 id="section-2-3"><strong>SECTION 2.3</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -722,7 +736,7 @@ Parameters:
 
                     
                         
-<h2 id="your-title-here">YOUR TITLE <br /> HERE</h2>
+<h2 id="section-here">SECTION # <br /> HERE</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quas, aliquid ab blanditiis omnis odio repellat?</p>
 <p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
 
@@ -862,7 +876,7 @@ Parameters:
 
                     
                         
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-4-1"><strong>SECTION 4.1</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -891,7 +905,7 @@ Parameters:
 
                     
                         
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-4-2"><strong>SECTION 4.2</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1030,7 +1044,7 @@ Parameters:
 
                     
                         
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-4-3"><strong>SECTION 4.3</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1059,7 +1073,7 @@ Parameters:
 
                     
                         
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-4-5"><strong>SECTION 4.5</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1191,7 +1205,7 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h2 id="title-header">TITLE <br /> HEADER</h2>
+                        <h2 id="section-5-header">SECTION 5 <br /> HEADER</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1340,7 +1354,7 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h2 id="title">TITLE</h2>
+                        <h2 id="section-6">SECTION 6</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit</p>
 <p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
 

public/index.html

@@ -170,14 +170,21 @@
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page2
                         </a>
                         <div class="relative">
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page3
                         </a>
                         <div class="relative">
@@ -211,14 +218,21 @@
                              
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page2
                             </a>
                             <hr/>
                         
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page3
                             </a>
                             <hr/>
@@ -366,9 +380,9 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h1 id="text-8xl">TITLE</h1>
-<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.<br> Quas, aliquid ab blanditiis omnis odio repellat?</p>
-<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
+                        <h1 id="text-8xl">MyTrunk</h1>
+<p>My trunk is an idea that a good friend and I had a long time ago. This was at the start of the whole .com boom where everyone that had an idea got millions to execute on it. Many of these initial ideas failed, some of them became the monopolies of today, Google, Facebook and Amazon. We never launched the mytrunk.com domain and this site is an ode to that lost opportunity in which I organize my daily online life.</p>
+<p><button><a href="https://examplezola.tf/">Like!</a></button></p>
 
                     
                 </div>
@@ -530,7 +544,7 @@ Parameters:
 
                     
                         <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-2-1"><strong>SECTION 2.1</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -546,7 +560,7 @@ Parameters:
                     
                         
 <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-2-2"><strong>SECTION 2.2</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -562,7 +576,7 @@ Parameters:
                     
                         
 <p><img src="https://examplezola.tf/home/placeholder.jpg#medium" alt="Lorem" /></p>
-<h3 id="title-2"><strong>TITLE</strong></h3>
+<h3 id="section-2-3"><strong>SECTION 2.3</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
 
                     
@@ -720,7 +734,7 @@ Parameters:
 
                     
                         
-<h2 id="your-title-here">YOUR TITLE <br /> HERE</h2>
+<h2 id="section-here">SECTION # <br /> HERE</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quas, aliquid ab blanditiis omnis odio repellat?</p>
 <p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
 
@@ -860,7 +874,7 @@ Parameters:
 
                     
                         
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-4-1"><strong>SECTION 4.1</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -889,7 +903,7 @@ Parameters:
 
                     
                         
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-4-2"><strong>SECTION 4.2</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1028,7 +1042,7 @@ Parameters:
 
                     
                         
-<h3 id="title"><strong>TITLE</strong></h3>
+<h3 id="section-4-3"><strong>SECTION 4.3</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1057,7 +1071,7 @@ Parameters:
 
                     
                         
-<h3 id="title-1"><strong>TITLE</strong></h3>
+<h3 id="section-4-5"><strong>SECTION 4.5</strong></h3>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1189,7 +1203,7 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h2 id="title-header">TITLE <br /> HEADER</h2>
+                        <h2 id="section-5-header">SECTION 5 <br /> HEADER</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.Quas, aliquid ab blanditiis omnis odio repellat?</p>
 
                     
@@ -1338,7 +1352,7 @@ Parameters:
                     <!-- handles mermaid markdown content display -->
 
                     
-                        <h2 id="title">TITLE</h2>
+                        <h2 id="section-6">SECTION 6</h2>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit</p>
 <p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
 

public/sitemap.xml

@@ -3,6 +3,10 @@
     <url>
         <loc>https://examplezola.tf/</loc>
     </url>
+    <url>
+        <loc>https://examplezola.tf/buy/</loc>
+        <lastmod>2021-02-20</lastmod>
+    </url>
     <url>
         <loc>https://examplezola.tf/categories/</loc>
     </url>
@@ -11,11 +15,11 @@
         <lastmod>2021-02-20</lastmod>
     </url>
     <url>
-        <loc>https://examplezola.tf/page2/</loc>
+        <loc>https://examplezola.tf/specs/</loc>
         <lastmod>2021-02-20</lastmod>
     </url>
     <url>
-        <loc>https://examplezola.tf/page3/</loc>
+        <loc>https://examplezola.tf/technology/</loc>
         <lastmod>2021-02-20</lastmod>
     </url>
 </urlset>

public/specs/index.html

@@ -170,14 +170,21 @@
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page2
                         </a>
                         <div class="relative">
                         </div>
                     
                     
-                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
                             page3
                         </a>
                         <div class="relative">
@@ -211,14 +218,21 @@
                              
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page2&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page2
                             </a>
                             <hr/>
                         
                             
                             
-                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;page3&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
                                 page3
                             </a>
                             <hr/>
@@ -375,7 +389,7 @@ Parameters:
                     
                         <h1 id="text-8xl">TITLE</h1>
 <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
-<p><img src="https://examplezola.tf/page2/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
+<p><img src="https://examplezola.tf/specs/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
 
                     
                 </div>

public/technology/index.html

@@ -0,0 +1,446 @@
+<!DOCTYPE html>
+<html lang="en" charset="utf-8">
+
+    
+
+
+
+
+
+<head>
+  <meta name="generator" content="Zola v.0.13.0 - getzola.org" />
+
+  
+  
+  <title>page3 &bull; examplezola</title>
+  <meta property="og:title" content="page3 &bull; examplezola" />
+  
+  
+
+  <!-- Required meta categories -->
+  <meta charset="utf-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+  <!-- **** BEGINNING, favicons **** -->
+
+  <!-- generics -->
+
+  <!-- iOS -->
+
+  <!-- Android -->
+
+  <!-- Windows 8, IE 10 -->
+
+  <!-- Windows 8.1 and up, IE 11 -->
+
+  <!-- **** CONCLUSION, favicons **** -->
+
+  <!-- CSS/SCSS -->
+  <link rel="stylesheet" href="https://examplezola.tf/css/index.css?h=8ea8a615d5a5a9339423096c45329cf61cd2193f52db4447f8ae0248efacaed8" />  <style>@-moz-document url-prefix() {.lazy:-moz-loading {visibility:hidden;}}.ieOnly {display: none;}@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {.ieOnly {display: block;}}</style>
+  
+</head>
+
+    
+    <body>
+        <!--
+  Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
+  Read the documentation to get started: https://tailwindui.com/documentation
+--><!-- This example requires Tailwind CSS v1.4.0+ -->
+
+<script type="text/javascript">
+    
+    var displayedMenu = "";
+    var hamburgerShown = false;
+    let width = screen.width;
+    var isMobile = width < 1024;
+
+    function toggleMenu(button) {
+        if (displayedMenu === button.id.split("-")[0]) { 
+            button.className = button.className.replace(" text-blue-500 bg-stone-200 sm:bg-transparent", " text-gray-900");
+            hideMenu(button.id.split("-")[0]);
+            button.lastElementChild.className = button.lastElementChild.className.replace("rotate-0", "-rotate-90")
+            displayedMenu = "";
+        }
+        else { 
+            showMenu(button.id.split("-")[0]);
+            button.lastElementChild.className = button.lastElementChild.className.replace("-rotate-90", "rotate-0")
+            button.className = button.className.replace(" text-gray-900", " text-blue-500 bg-stone-200 sm:bg-transparent");
+            displayedMenu = button.id.split("-")[0]
+        }
+    }
+
+    function handleClick(button) {
+        if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") { toggleHamburger() }
+        if (button.id.indexOf("menu") !== -1 ) { 
+            toggleMenu(button) 
+        }
+    }
+
+    function toggleHamburger() {
+        if (hamburgerShown) { 
+            hideHamburger();
+            hamburgerShown = false;
+        }
+        else { 
+            showHamburger();
+            hamburgerShown = true;
+        }
+    }
+
+    function showMenu(menuName) {
+        var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
+        var menuBtnId = menuName + (isMobile ? '-mobile-menu' : '-menu');
+        var menuElement = document.getElementById(menuId)
+        menuElement.className = menuElement.className.replace(" hidden" , "");
+        setTimeout(function() { menuElement.className = menuElement.className.replace("duration-200 ease-in opacity-0 -translate-y-1", "duration-150 ease-out opacity-1 -translate-y-0"); }, 10);
+    }
+
+    function hideMenu(menuName) {
+        var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
+        var menuElement = document.getElementById(menuId)
+        menuElement.className = menuElement.className.replace("duration-150 ease-out opacity-1 -translate-y-0", "duration-200 ease-in opacity-0 -translate-y-1");
+        setTimeout(function() { menuElement.className = menuElement.className + " hidden" }, 300);
+    }
+
+    function showHamburger() {
+        document.getElementById('header-container').className = "overflow-hidden";
+        document.getElementById('hamburger').className = "fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right";
+        document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
+        document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
+    }
+
+    function hideHamburger() {
+        document.getElementById('header-container').className = "";
+        document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
+        document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
+        document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
+        if (displayedMenu !== "") { hideMenu(displayedMenu); }
+    }
+
+    window.onload = function(){
+        let elements = document.getElementsByTagName("button");
+        let buttons = [...elements]
+        buttons.forEach((button) => {
+            button.addEventListener( 'click', function() { handleClick(button) });
+        })
+        document.getElementById("mobile-learn-btn").addEventListener( 'click', toggleMenu);
+    }
+
+</script>
+
+
+<!-- set variables used for header template -->
+
+
+
+
+
+    <header id="header-container">
+        
+        <div class="z-10 bg-white fixed w-screen max-w-full customize">
+            <div class="relative z-50 shadow">
+            <div class="mx-auto flex z-50 shadow justify-between items-center pl-6 pr-2 md:pr-0 lg:py-5  md:px-12 py-2 lg:px-20 lg:justify-start lg:space-x-20">
+                <div>
+                    <a href="/" class="flex">
+                        <img class="h-auto sm:w-15" src="https:&#x2F;&#x2F;examplezola.tf&#x2F;images&#x2F;logo_placeholder.jpg" alt="Logo" />
+                    </a>
+                </div>
+                <div class="-mr-2 -my-2 lg:hidden">
+                    <button id="hamburger-btn" type="button" class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
+                        <!-- Heroicon name: menu -->
+                        <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+                        </svg>
+                    </button>
+                <button id="close-hamburger-btn" type="button" class="hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2">
+                    <!-- Heroicon name: x -->
+                    <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+                    </svg>
+                    </button>
+                </div>
+                <div class="hidden lg:flex-1 lg:flex lg:items-center lg:justify-end lg:space-x-12">
+                    <nav class="flex space-x-10">    
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;home&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            Home
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page2
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                        <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg leading-6 text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150 mt-0">
+                            page3
+                        </a>
+                        <div class="relative">
+                        </div>
+                    
+                    
+                    </nav>
+                </div>
+            </div>
+        </div>
+    
+    
+        
+            <!--
+            Mobile menu, show/hide based on mobile menu state.
+        
+            Entering: "duration-200 ease-out"
+                From: "opacity-0 scale-95"
+                To: "opacity-100 scale-100"
+            Leaving: "duration-100 ease-in"
+                From: "opacity-100 scale-100"
+                To: "opacity-0 scale-95"
+            -->
+        <div id="hamburger" class="hidden fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden">
+            <div>
+                <div class="shadow-xs h-screen bg-white divide-y-2 divide-gray-50">
+                    <div class="pt-6 sm:px-12 md:px-16 lg:px-20 space-y-6 sm:space-y-8 sm:pb-8 max-h-screen overflow-y-auto">
+    
+                        <nav class="flex flex-col justify-around pb-12">
+                        
+                             
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;buy&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;specs&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page2
+                            </a>
+                            <hr/>
+                        
+                            
+                            
+                            <a href="https:&#x2F;&#x2F;examplezola.tf&#x2F;technology&#x2F;" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
+                                page3
+                            </a>
+                            <hr/>
+                        
+                        
+                        
+                        </nav>                    
+                    </div>
+                
+            </div>
+            
+            </div>
+        </div>
+    
+    
+    </header>
+    
+
+
+
+
+        <div id="content" class="mx-auto overflow-hidden">
+            
+
+<main>
+    <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
+    <script>mermaid.initialize({startOnLoad:true});</script>
+    <div>
+        
+            <br>
+<!-- section 1 (co-found) -->
+<!-- row shortcode 
+Shortcode used in markdown for the creation of mobile compatible vertical rows
+Divides markdown into columns by splitting content using column identifier "|||"
+Creates equal width blocks in a flex row.
+
+Parameters: 
+- style: 
+    - lean: if style is lean, the row doesn't have outer margins
+- bgPath: if bgPath is passed, the row has a full width background
+-->
+
+
+<!-- This fixes link & img paths in local, prod, and wth prefix -->
+
+    
+    
+    
+        
+            
+            
+        
+            
+            
+            
+                
+                    
+                    
+                
+            
+            
+        
+            
+            
+            
+                
+            
+            
+        
+    
+
+
+
+
+
+
+<!-- aligns columns depending on col number-->
+ 
+    
+
+
+
+
+
+
+
+
+
+<!-- Padding -->
+
+
+
+
+    
+        
+    
+
+
+
+
+
+
+
+<!-- Margins -->
+
+
+
+
+    
+        
+    
+    
+
+
+
+
+
+
+
+
+    
+        
+        
+    
+
+    
+
+     <!-- makes row semi-full screen width, strips margins -->
+    
+
+        <!-- makes row full screen width, strips margins -->
+    
+
+    
+    
+
+
+
+
+
+<!-- makes row full screen width and adds background img -->
+
+
+
+
+
+
+
+
+<!-- Cancels page margins so that rows can have separate margins -->
+
+
+
+        <div id="" class="relative justify-center flex overflow-hidden  " style="">
+            <div id="" class="relative flex flex-col md:flex md:flex-row flex-wrap max-w-fit overflow-hidden lg:items-center py-8 md:py-4 lg:py-28 mx-12 sm:mx-20 md:mx-28 lg:mx-40 my-10 text-center items-center mx-auto " style="min-width: -webkit-fill-available; min-width: -moz-available"> 
+        
+         
+
+            <!-- Hides empty columns if displayed vertically in small screen -->
+            
+                <div class="flex-1 mb-4 md:mb-12 lg:mb-0 lg:mx-2 xl:mx-4 flex-1 ">
+                    <!-- handles mermaid markdown content display -->
+
+                    
+                        <h1 id="text-8xl">TITLE</h1>
+<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit.</p>
+<p><button><a href="https://examplezola.tf/">BUTTON</a></button></p>
+
+                    
+                </div>
+            
+         
+
+            <!-- Hides empty columns if displayed vertically in small screen -->
+            
+                <div class="flex-1 mb-4 md:mb-12 lg:mb-0 lg:mx-2 xl:mx-4 flex-1 ">
+                    <!-- handles mermaid markdown content display -->
+
+                    
+                        
+<p><img src="https://examplezola.tf/technology/placeholder.jpg#medium#mx-auto" alt="Image" /></p>
+
+                    
+                </div>
+            
+        
+    </div>
+</div>
+        
+    </div>
+
+ </main>     
+        </div>
+        <!--
+  Tailwind UI components require Tailwind CSS v1.8 and the @tailwindcss/ui plugin.
+  Read the documentation to get started: https://tailwindui.com/documentation
+-->
+
+
+
+<footer class="bottom-0">
+    
+        
+        <div class="customize">
+            
+            <p class="text-center">ALL RIGHTS RESERVED 2022</p>
+        </div>
+    
+</footer>
+    </body>
+</html>