Yori's Template

[attr="class","overall"]

[attr="class","box1"]

[attr="class","words"]1000 Words

[attr="class","notes"]

[attr="class","scrollnotes"]Notes notes notes gallore. Keep them short. Keep them short. Keep them short. Keep them short. Keep them short. Keep them short. Keep them short. Keep them short.

[attr="class","message1"]
You have my heart
In the palm
of your Hands

[attr="class","header2"]

[attr="class","header3"]

[attr="class","colordodge"]

[attr="class","message2"]
You can’t see
The stars but...

[attr="class","colordodge"]

[attr="class","topborder"]

[attr="class","slant"]

[attr="class","content"]

[attr="class","content2"]

[attr="class","avi"]

[attr="class","avilines"]

[attr="class","avicircle"]

[attr="class","diamond"]

[attr="class","diamond2"]

[attr="class","diamond3"]

[attr="class","diamond4"]

[attr="class","content3"][attr="class","scrollnotes"]
Lorem Ipsum lorum ipsum lorem I lorem ipsum lorem ipsum lorem ip some lorem mm ipsum Lorem Ipsum loru ipsum lorem I lorem ipsum lorem ips m lorem ipsome lorem ipsum ipsum lorem orem ipsum lorem ipsum lorem ipsome lorem ipsum lorem ips m lorem ipsome lorem ipsum ipsum lorem orem ipsum lorem ipsum lorem ipsome lorem ipsum Lorem Ipsum lorum ipsum lorem I lorem ipsum lorem ipsum lorem ip some lorem mm ipsum Lorem Ipsum loru ipsum lorem I lorem ipsum lorem ips m lorem ipsome lorem ipsum ipsum lorem orem ipsum.

Ipsum lorem ipsum lorem ipsome lorem ipsum lorem ips m lorem ipsome lorem ipsum ipsum lorem orem ipsum lorem ipsum lorem ipsome lorem ipsum Lorem Ipsum lorum ipsum lorem I lorem ipsum lorem ipsum lorem ip some lorem mm ipsum Lorem Ipsum loru ipsum lorem I.

[googlefont=Share Tech Mono][googlefont=VT323]
[newclass=".box1"]position:relative;[/newclass]
[newclass=".colordodge"]background-blend-mode:color-dodge;opacity:0.6;[/newclass]
[newclass=".topborder"]position:relative;z-index:30;[/newclass]
[newclass=".header2"]width:0;height:291px;overflow:hidden;position:relative;z-index:20;margin-top:-295px;margin-left:-100px;transform:skew(-20deg);transition:width 1s ease;[/newclass]
[newclass=".overall:hover .header2"]width:700px;[/newclass]
[newclass=".header3"]width:500px;height:281px;transform:skew(20deg);margin-left:103px;background-image:url(https://imagizer.imageshack.com/img924/7276/e7yOg3.png);[/newclass]
[newclass=.slant]-webkit-clip-path: polygon(0 25%, 100% 0%, 100% 75%, 0% 100%);-moz-clip-path: polygon(0 25%, 100% 0%, 100% 75%, 0% 100%);clip-path: polygon(0 25%, 100% 0%, 100% 75%, 0% 100%);background-color:#ffffff;position:relative;z-index:40;width:502px;height:71px;background-color:ffffff;margin-top:-25px;margin-bottom:-27px;[/newclass]
[newclass=.content]width:490px;min-height:500px;border:1px solid #ffffff;background-image:url(https://imagizer.imageshack.com/img922/6360/KynNQw.png);margin-top:-28px;margin-bottom:-28px;z-index:0;[/newclass]
[newclass=.avi]z-index:100;position:relative;shape-outside: circle(45%)!important;[/newclass]

[newclass=.avicircle]position: relative; width: 144px; height: 144px; padding: 5px; border: 6px solid rgba(255,255,255,0.4); border-left-color: transparent; border-right-color: transparent; border-radius: 50%; margin-left: -32px; margin-top: -183px; animation: circleani 15s linear infinite;[/newclass]
[newclass=.avicircle div]width: 164px; height: 164px; border: 3px solid rgba(255,255,255,0.3); border-radius: 50%; border-top-color: transparent; border-bottom-color: transparent; animation: circleani 6s linear infinite; } @keyframes circleani { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes circleani { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); }[/newclass]

[newclass=.content2]word-wrap:break-word;[/newclass]
[newclass=.content3]word-wrap:break-word;text-align:justify;margin-top:-90px;position:relative;[/newclass]
[newclass=".avilines"]width: 97px; height: 97px; border: 6px solid #a33d47; border-left-color: transparent; border-right-color: transparent; border-radius: 50%; position: relative; top: -30px; right: 2px; transform: rotate(45deg); transition: 0.75s;[/newclass]
[newclass=".overall:hover .avilines"]transform: rotate(-45deg);[/newclass]
[newclass=".diamond"]transform: rotate(-45deg);z-index:50;position:relative;[/newclass]
[newclass=".diamond img"]z-index:50;position:relative;height:106px;width:106px;margin-top:-28px;[/newclass]
[newclass=".diamond2"]z-index:60;position:relative;width:84px;height:84px;border: 1px solid #ffffff;margin-right: 5px;margin-top:-94px;float:right;[/newclass]
[newclass=".diamond3"]transform: rotate(-45deg);z-index:50;position:relative;[/newclass]
[newclass=".diamond3 img"]z-index:50;position:relative;height:106px;width:106px;margin-top:-28px;[/newclass]
[newclass=".diamond4"]z-index:60;position:relative;width:84px;height:84px;border: 1px solid #ffffff;margin-right: 10px;margin-top:-100px;float:right;[/newclass]
[newclass=.scrollnotes::-webkit-scrollbar-thumb]background-color:#ffffff;border:none;border-radius:0px;[/newclass]
[newclass=.scrollnotes::-webkit-scrollbar-track]background-color:transparent;border:none;border-radius:0px;[/newclass]
[newclass=.scrollnotes::-webkit-scrollbar]width:1px;[/newclass]
[newclass=".message1 b"]color:#e8a2ab;font-weight:100;[/newclass]
[newclass=".words"]position:relative;z-index:10;[/newclass]
[newclass=".notes"]position:relative;z-index:10;[/newclass]
[newclass=".message1"]position:relative;z-index:10;[/newclass]
[newclass=".message2"]position:relative;z-index:50;[/newclass]
[newclass=".message2 b"]color:#e8a2ab;font-weight:100;[/newclass]