Last edited by Hatsuharu on Tue May 22, 2018 9:20 am; edited 16 times in total
Hatsuharu's HTML Tests ♫
Fri Feb 23, 2018 12:23 pm
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce a lobortis felis. Aenean dignissim massa porta magna ullamcorper, pretium imperdiet libero malesuada. Fusce ornare arcu eget finibus rutrum. Sed id orci finibus, congue justo sed, maximus mauris. Sed dapibus eros ut nibh auctor luctus. Donec nec feugiat lacus. Nunc et tincidunt lacus, vitae porttitor leo. Nulla maximus dictum ex quis venenatis. Integer eleifend nunc et erat convallis porta. Etiam lobortis, magna viverra bibendum scelerisque, mi dolor bibendum mauris, eu aliquet metus enim ut dolor. Aliquam eu gravida tortor. Maecenas id magna suscipit augue facilisis aliquam ac id justo.
Spells | ||||
D-Rank | C-Rank | B-Rank | A-Rank | S-Rank |
D-Rank Spells | |
Spell 1 | Spell 2 | Spell 3 | Spell 4 | Spell 5 |
C-Rank Spells | |
Spell 1 | Spell 2 | Spell 3 | Spell 4 | Spell 5 |
B-Rank Spells | |
Spell 1 | Spell 2 | Spell 3 | Spell 4 | Spell 5 |
A-Rank Spells | |
Spell 1 | Spell 2 | Spell 3 | Spell 4 | Spell 5 |
S-Rank Spells | |
Spell 1 | Spell 2 | Spell 3 | Spell 4 |
Thu Mar 08, 2018 1:54 pm
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus et tempus odio. Ut pretium varius purus, at molestie nisi gravida in. Vivamus in egestas mauris. Aliquam erat volutpat. Vestibulum at cursus erat, at elementum erat. Morbi mattis felis eu varius viverra. Mauris bibendum eleifend malesuada. Fusce sit amet nulla odio. Vivamus sapien leo, fermentum eget vulputate a, pharetra at metus. Duis ornare eu lacus a sollicitudin. Nam eu enim maximus, egestas nunc sed, eleifend neque. Ut eu gravida libero. Sed pretium consectetur urna a tempor.
Tue Apr 03, 2018 8:24 pm
Nulla et ornare lacus, vel dictum dui. Ut maximus mauris nec elementum lobortis. Maecenas condimentum fringilla quam, vitae viverra augue tempor ut. Nullam sodales vel metus et dapibus. Phasellus a pulvinar mauris. Sed ultricies pretium euismod. Vivamus quis lectus ut ligula faucibus lacinia sit amet nec leo. Sed ante neque, efficitur at dui in, elementum efficitur risus. Morbi lobortis felis sed arcu volutpat mollis. Proin faucibus volutpat erat. Integer eleifend erat tristique sollicitudin vehicula. Maecenas ut nulla vel leo tincidunt interdum at in nisl. Curabitur elementum enim orci, at pulvinar mi bibendum nec. Pellentesque vel bibendum tellus. Mauris eu magna sagittis, convallis sem sit amet, vehicula mi. Donec condimentum nunc vel diam bibendum convallis.
Mon May 21, 2018 6:01 am
Lorem ipsum dolor sit amet
Consectetur adipiscing elit
Proin ac semper magna. Mauris ut nibh in risus sollicitudin interdum non sit amet odio. Etiam condimentum varius sagittis. Proin eget nisl neque. Morbi odio sem, pretium ut sagittis nec, fermentum vehicula quam. Nam dui nunc, volutpat eget lacinia vitae, lacinia ac enim. Fusce aliquam erat vitae vestibulum pretium. Donec ullamcorper est ac massa finibus, at gravida massa consectetur. Aliquam sollicitudin mauris in mi suscipit pellentesque. Sed ut dignissim leo. Nulla finibus gravida magna at finibus. Duis vitae lorem sit amet quam pellentesque feugiat. Donec non neque eu massa malesuada semper sed ac enim. Sed tincidunt nisi mollis pharetra mollis. Nam bibendum purus non nisi aliquam, et bibendum tortor fringilla. Fusce feugiat nisl dolor, at facilisis velit tempus eu.
Nam turpis ligula, tempus in justo id, consectetur maximus elit. Aliquam erat volutpat. Aliquam sed massa a augue faucibus sollicitudin. Aliquam at odio ornare, tincidunt lorem id, feugiat est. Duis eu orci sit amet justo tempor condimentum vel vitae elit. Maecenas in lacus eu nisi malesuada porta. Vestibulum feugiat mollis nisl, a placerat metus aliquam quis. Etiam varius ante a enim pulvinar, id aliquet magna lobortis. Mauris hendrerit sed neque ac feugiat. Aenean convallis fringilla massa, a volutpat dui semper quis. Phasellus scelerisque venenatis consectetur. Quisque aliquet arcu nec nibh ultricies, vel congue ligula porta. Vivamus vel mollis eros. Suspendisse ac libero velit. Vestibulum vitae semper lorem. Vestibulum ut justo eu lacus venenatis imperdiet.
- The Numbers:
- Code:
<div class="haru-wings"><div class="haru-wing-left"></div><div class="haru-wing-right"></div><div class="haru-wing-hover"><span class="haru-hover-quote">
Lorem ipsum dolor sit amet
Consectetur adipiscing elit</span>
<iframe width="20" height="20" src="https://www.youtube.com/embed/NpEaa2P7qZI?start=5&loop=1" frameborder="0" allow="autoplay; encrypted-media"></iframe></div></div><div class="haru-post-wrapper"><div class="haru-post-img"></div><div class="haru-post-text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis orci neque, blandit eget magna at, cursus consequat nisl. Aenean eget lobortis est. Etiam vitae bibendum leo. Phasellus fringilla pulvinar semper. Proin suscipit, turpis ut accumsan tempor, sapien risus varius metus, at dapibus urna augue non diam. Nunc et vehicula elit. Nullam in auctor arcu. Pellentesque congue, mauris id vehicula imperdiet, libero est efficitur libero, vel maximus magna dui vel est. Fusce sodales rhoncus ex ac placerat. Integer scelerisque lectus vel libero finibus, vel accumsan turpis gravida. Curabitur gravida metus at ipsum posuere, in luctus est molestie. Praesent ac odio lectus. Integer eu laoreet ante. Pellentesque a porttitor odio.
Proin ac semper magna. Mauris ut nibh in risus sollicitudin interdum non sit amet odio. Etiam condimentum varius sagittis. Proin eget nisl neque. Morbi odio sem, pretium ut sagittis nec, fermentum vehicula quam. Nam dui nunc, volutpat eget lacinia vitae, lacinia ac enim. Fusce aliquam erat vitae vestibulum pretium. Donec ullamcorper est ac massa finibus, at gravida massa consectetur. Aliquam sollicitudin mauris in mi suscipit pellentesque. Sed ut dignissim leo. Nulla finibus gravida magna at finibus. Duis vitae lorem sit amet quam pellentesque feugiat. Donec non neque eu massa malesuada semper sed ac enim. Sed tincidunt nisi mollis pharetra mollis. Nam bibendum purus non nisi aliquam, et bibendum tortor fringilla. Fusce feugiat nisl dolor, at facilisis velit tempus eu.
Nam turpis ligula, tempus in justo id, consectetur maximus elit. Aliquam erat volutpat. Aliquam sed massa a augue faucibus sollicitudin. Aliquam at odio ornare, tincidunt lorem id, feugiat est. Duis eu orci sit amet justo tempor condimentum vel vitae elit. Maecenas in lacus eu nisi malesuada porta. Vestibulum feugiat mollis nisl, a placerat metus aliquam quis. Etiam varius ante a enim pulvinar, id aliquet magna lobortis. Mauris hendrerit sed neque ac feugiat. Aenean convallis fringilla massa, a volutpat dui semper quis. Phasellus scelerisque venenatis consectetur. Quisque aliquet arcu nec nibh ultricies, vel congue ligula porta. Vivamus vel mollis eros. Suspendisse ac libero velit. Vestibulum vitae semper lorem. Vestibulum ut justo eu lacus venenatis imperdiet.
[spoiler="The Numbers"][/spoiler]</div></div>
<style type="text/css">@import url('https://fonts.googleapis.com/css?family=Cinzel');@import url('https://fonts.googleapis.com/css?family=Muli');.haru-wing-hover { clear:both;background:#161616;border-radius:5px 5px 0 0;width:370px;height:145px;margin:auto;padding:15px;text-align:center;opacity:0;position:relative;z-index:2;transition:opacity 1s;transition-delay:0.1s; }.haru-hover-quote { font-size:1.4em;font-family:'Cinzel',Arial;line-height:1.3em;color:#bb0a1e;text-shadow:0px 0px 15px #bb0a1e;font-weight:bold; }.haru-wings:hover .haru-wing-hover { opacity:0.9; }.haru-wing-left { float:left;width:50%;height:200px;background-image:url('https://i.postimg.cc/SRxZchhB/Vamp-Wings-Mirror.png');opacity:0;background-repeat:no-repeat;background-position:center center;position:relative;z-index:3;margin-bottom:-200px;transition: transform 1s, opacity 1s;transition-delay:0.1s; }.haru-wing-right { float:right;width:50%;height:200px;background-image:url('https://i.postimg.cc/Y93n4SJN/Vamp-Wings.png');opacity:0;background-repeat:no-repeat;background-position:center center;position:relative;z-index:3;margin-bottom:-200px;transition: transform 1s, opacity 1s;transition-delay:0.1s; }.haru-wings:hover .haru-wing-left { transform:rotate(-20deg) translate(-30px,20px);opacity:1; }.haru-wings:hover .haru-wing-right { transform:rotate(20deg) translate(30px,20px);opacity:1; }.haru-post-wrapper { width:400px;background:#161616;box-shadow: 0px 0px 15px #bb0a1e;border-radius:5px;margin:-175px auto auto auto;position:relative;z-index:1; }.haru-post-img { width:400px;height:175px;background-image:url('https://i.postimg.cc/sxbp1dD9/Hatsu.jpg');border-radius: 5px 5px 0 0; }.haru-post-text { font-family:'Muli';line-height:150%;padding:25px;color:#e5e4e2; }.haru-dialogue { color:#bb0a1e;text-shadow:0px 0px 9px #bb0a1e; }.haru-post-wrapper .codebox { border: none; }.haru-post-wrapper .codebox dt { border-bottom: 1px solid #bb0a1e; }</style>
Permissions in this forum:
You cannot reply to topics in this forum