posted Dec 1, 2018 22:22:48 GMT -6 in hello, planet
[googlefont=Roboto:400,600,700|Raleway:200|Roboto+Condensed:400,700]
[newclass=.selk-hello-planet .abc-selk-contain h1, .selk-hello-planet .abc-selk-hash a, .selk-hello-planet .abc-selk-rules h2]color:#21B7EC!important;[/newclass]
[newclass=.selk-hello-planet .abc-selk-link]background-color:#21B7EC!important;[/newclass]
[newclass=.abc-selk-contain, .selk-code] --abc-selk-accent:#CCCCCC; [/newclass]
[newclass=.abc-selk-contain] width:500px; padding:25px; -webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px; background-color:#eee; display:flex; flex-flow:row wrap; justify-content:space-between; position:relative; overflow:hidden; [/newclass]
[newclass=.abc-selk-contain h1] margin:0px; width:100%; display:flex; flex-flow:row wrap; align-items:center; font:200 32px/32px Raleway; color:var(--abc-selk-accent); [/newclass]
[newclass=.abc-selk-contain h1:after] content:''; width:10px; height:1px; background-color:#ccc; flex-grow:2; margin-left:25px; [/newclass]
[newclass=.abc-selk-contain h1:before] content:'A-B-'; color:#ccc; [/newclass]
[newclass=.abc-selk-body] width:350px; border-radius:5px; color:#aaa; font:400 11px roboto; text-align:justify; margin-top:25px; [/newclass]
[newclass=.abc-selk-text] background-color:#fafafa; padding:25px; border-radius:5px; [/newclass]
[newclass=.abc-selk-hash] margin:25px 0px; text-align:left; [/newclass]
[newclass=.abc-selk-hash a] display:inline-block; height:10px; padding:5px 7px; margin:0px 3px 5px 0px; color:var(--abc-selk-accent); background-color:#ddd; border-radius:2px; text-transform:uppercase; font:600 10px/10px roboto; [/newclass]
[newclass=.abc-selk-colorpickers] width:309px; display:flex; flex-flow:row wrap; align-items:flex-start; [/newclass]
[newclass=.abc-selk-color] display:flex; flex-flow:row nowrap; width:309px; [/newclass]
[newclass=.abc-selk-color div] height:10px; display:inline-block; margin-right:5px; background-color:#ccc; [/newclass]
[newclass=.abc-selk-color span] height:10px; width:0px; display:flex; font:600 9px/10px Roboto; color:#ccc; [/newclass]
[newclass=.abc-selk-var] width:340px; font:400 10px/13px roboto; margin-top:25px; padding-right:10px; height:25px; overflow:auto; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar] width:5px; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-thumb] background-color:#999; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-track] background-color:#ddd; border:0px; [/newclass]
[newclass=.abc-selk-rules] margin:25px 0px 0px 0px; text-align:left; width:125px; display:flex; justify-content:flex-start; align-self:stretch; flex-flow:column nowrap; border-right:1px solid #ddd; [/newclass]
[newclass=.abc-selk-rules img] width:100px; height:100px; border-radius:5px; [/newclass]
[newclass=.selk-code] background-color:#eee; width:500px; padding:25px; -webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; margin-top:-25px; position:relative; overflow:hidden; [/newclass]
[newclass=.selk-code div] margin:0px!important; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; [/newclass]
[newclass=.selk-code div span] display:inline-block; font:700 9px roboto; color:#333; text-transform:uppercase; background-color:#ddd; margin:0px 5px 25px 0px; padding:5px 8px; border-radius:3px; [/newclass]
[newclass=.selk-code code] display:block; width:400px!important; height:100px!important;overflow:auto!important; padding:25px!important; text-align:justify; border-radius:5px; font:11px roboto; color:#aaa; background-color:#f7f7f7; border:0px!important; [/newclass]
[newclass=.selk-code .code_tag_toggle]margin-top:25px; border:0px!important; color:#333!important; font:700 9px/9px roboto!important; padding:5px 10px!important; border-radius:3px!important;[/newclass]
[newclass=.abc-selk-link] position:absolute; bottom:0px; right:0px; height:45px; width:45px!important; background-color:var(--abc-selk-accent); display:flex!important; align-items:center!important; justify-content:center!important; border-radius:0px; [/newclass]
[newclass=.abc-selk-link i] font-size:20px; color:#fafafa; [/newclass][break][break]
[nospaces][googlefont=Muli:900|Ubuntu:400]
[newclass=.hlplIM] --planetAccent1:#94DCD4; --planetAccent2:#21B7EC; [/newclass]
[newclass=.hlplIM] width:400px; height:500px; overflow:hidden; border-radius:3px; [/newclass]
[newclass=.hlplBanner] height:10px; padding:5px 10px; background-color:#333; color:#fafafa; font:100 10px/21px ubuntu; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.hlplContact] height:93px; padding:10px 10px; background-image: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-start; overflow:hidden; [/newclass]
[newclass=.hlplContact img] width:75px; height:75px; border-radius:100%; padding:30px; background-color:rgba(255,255,255,.2); [/newclass]
[newclass=.hlplContact h1] font:900 25px/25px Muli; color:#fafafa; margin-left:-20px; text-align:left; text-transform:uppercase; [/newclass]
[newclass=.hlplContact h1 a] color:#fafafa!important; font:900 25px/25px Muli!important; text-shadow:2px 2px rgba(0,0,0,.075)!important;[/newclass]
[newclass=.hlplMessages] height:342px; width:400px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; [/newclass]
[newclass=.hlplMessages h1, h2] margin:0px 10px 10px 10px; max-width:300px; color:#fafafa; padding:10px; font:12px roboto; border-radius:3px; width:auto; [/newclass]
[newclass=.hlplMessages h1 img, h2 img] border-radius:3px; display:block; max-width:300px; border:1px solid rgba(255,255,255,.5);[/newclass]
[newclass=.hlplMessages h1] background: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); margin-left: auto; text-align:right; [/newclass]
[newclass=.hlplMessages h2] background: var(--planetAccent2); margin-right:auto; text-align:left; [/newclass]
[newclass=.hlplSend] background-image: linear-gradient(to right, var(--planetAccent1), var(--planetAccent2) ); height:35px; padding:0px 5px; display:flex; flex-flow:row wrap; align-items:center; justify-content:flex-start; [/newclass]
[newclass=.hlplSend div] width:318px; height:13px; margin:0px 5px; padding:5px; background-color:rgba(255,255,255,.25); font:400 10px/15px Ubuntu; color:#fafafa; cursor:text; [/newclass]
[newclass=.hlplSend div::before] content:'ENTER YOUR MESSAGE...'; [/newclass]
[newclass=.hlplSend span] color:#fafafa; width:25px; height:25px; background-color:rgba(255,255,255,.33); display:flex; align-items:center; justify-content:center; border-radius:100%; font-size:12px; transition:.1s ease; [/newclass]
[newclass=.hlplSend span:hover] font-size:15px; cursor:pointer; transition:.1s ease; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-track] background-color:#eee;border:0px;[/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-thumb] background-image: linear-gradient(to bottom, var(--planetAccent1), var(--planetAccent2) );border-radius:7px;border:0px; [/newclass]
[newclass=.hlplCredit] font:800 7px roboto; margin-left:350px; [/newclass]
[newclass=.hlplCredit a] font:800 7px roboto; [/newclass]
[newclass=.hlplhoneybee]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-paper-clip-o:before]font-family: "honeybee";content:"\e269";[/newclass]
[newclass=.th-up-direction:before]font-family: "honeybee";content:"\e48e";[/newclass]
[attr="class","selk-hello-planet"]
[attr="class","abc-selk-contain"]
hello, planet
[attr="class","abc-selk-rules"]
[attr="class","abc-selk-body"]
[attr="class","abc-selk-text"]
it's miku time. i have v. distinct memories of jamming out to this song as a child, and then looking up what the lyrics actually were and thinking.... D: it's still a good song tho, ngl. [break][break]
your sent messages are enclosed in [*h1][*/h1] tags and your received messages are in [*h2][*/h2] tags. the font icons at the bottom are self-hosted, so they'll work regardless of whether or not your site has honeybee icons installed.
it's miku time. i have v. distinct memories of jamming out to this song as a child, and then looking up what the lyrics actually were and thinking.... D: it's still a good song tho, ngl. [break][break]
your sent messages are enclosed in [*h1][*/h1] tags and your received messages are in [*h2][*/h2] tags. the font icons at the bottom are self-hosted, so they'll work regardless of whether or not your site has honeybee icons installed.
[attr="class","abc-selk-hash"]
[HASH]lighttechnology [HASH]im [HASH]instantmessage [HASH]gradient [HASH]icon [HASH]scroll [HASH]muli [HASH]roboto [HASH]ubuntu [HASH]honeybeeicons [HASH]abcsofcode
[HASH]lighttechnology [HASH]im [HASH]instantmessage [HASH]gradient [HASH]icon [HASH]scroll [HASH]muli [HASH]roboto [HASH]ubuntu [HASH]honeybeeicons [HASH]abcsofcode
[attr="class","abc-selk-colorpickers"]
[attr="class","abc-selk-color"]
#94DCD4
#94DCD4
[attr="class","abc-selk-color"]
#21B7EC
#21B7EC
[attr="class","abc-selk-var"]
this template uses css variables for easier editing and is therefore incompatible with internet explorer. if you need this cross-compatibility, use a search and replace to change var(--planetAccent1) and var(--planetAccent2) to the desired hex codes.
this template uses css variables for easier editing and is therefore incompatible with internet explorer. if you need this cross-compatibility, use a search and replace to change var(--planetAccent1) and var(--planetAccent2) to the desired hex codes.
[attr="class","selk-code"]
edit as much as you want!
don't touch the credits!
i'd love to see how you use it!
edit as much as you want!
don't touch the credits!
i'd love to see how you use it!
[nospaces][googlefont=Muli:900|Ubuntu:400]
[newclass=.hlplIM] --planetAccent1:#94DCD4; --planetAccent2:#21B7EC; [/newclass]
[div align="center"]
[div][attr="class","hlplIM"]
[div][attr="class","hlplContact"]
[img src="https://i.imgur.com/wTujHsB.png" style="display:block; width:75px; height:75px;"]
[h1]@admin[/h1]
[/div]
[div][attr="class","hlplMessages"]
[h1]to my lonely bed[/h1]
[h1]good morning, good morning[/h1]
[h2]to a coelacanth tail[/h2]
[h1]good morning, good morning[/h1]
[h2]to a sphinx tail[/h2]
[h1]good morning, good morning[/h1]
[h1]to you in my cache memory[/h1]
[h2]good morning, good morning[/h2]
[h1][img src="https://i.imgur.com/TXjEMJN.png" style="max-width:300px;"][/h1]
[/div]
[div][attr="class","hlplSend"][span][attr="class","th th-paper-clip-o"][/span] [div][/div] [span][attr="class","th th-up-direction"][/span][/div]
[/div]
[div][attr="class","hlplCredit"][a href="http://pixel-perfect.boards.net/user/15"]SELKIE[/a][/div]
[/div]
[newclass=.hlplIM] width:400px; height:500px; overflow:hidden; border-radius:3px; [/newclass]
[newclass=.hlplBanner] height:10px; padding:5px 10px; background-color:#333; color:#fafafa; font:100 10px/21px ubuntu; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.hlplContact] height:93px; padding:10px 10px; background-image: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-start; overflow:hidden; [/newclass]
[newclass=.hlplContact img] width:75px; height:75px; border-radius:100%; padding:30px; background-color:rgba(255,255,255,.2); [/newclass]
[newclass=.hlplContact h1] font:900 25px/25px Muli; color:#fafafa; margin-left:-20px; text-align:left; text-transform:uppercase; [/newclass]
[newclass=.hlplContact h1 a] color:#fafafa!important; font:900 25px/25px Muli!important; text-shadow:2px 2px rgba(0,0,0,.075)!important;[/newclass]
[newclass=.hlplMessages] height:342px; width:400px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; [/newclass]
[newclass=.hlplMessages h1, h2] margin:0px 10px 10px 10px; max-width:300px; color:#fafafa; padding:10px; font:12px roboto; border-radius:3px; width:auto; [/newclass]
[newclass=.hlplMessages h1 img, h2 img] border-radius:3px; display:block!important; max-width:300px!important; border:1px solid rgba(255,255,255,.5);[/newclass]
[newclass=.hlplMessages h1] background: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); margin-left: auto; text-align:right; [/newclass]
[newclass=.hlplMessages h2] background: var(--planetAccent2); margin-right:auto; text-align:left; [/newclass]
[newclass=.hlplSend] background-image: linear-gradient(to right, var(--planetAccent1), var(--planetAccent2) ); height:35px; padding:0px 5px; display:flex; flex-flow:row wrap; align-items:center; justify-content:flex-start; [/newclass]
[newclass=.hlplSend div] width:318px; height:13px; margin:0px 5px; padding:5px; background-color:rgba(255,255,255,.25); font:400 10px/15px Ubuntu; color:#fafafa; cursor:text; [/newclass]
[newclass=.hlplSend div::before] content:'ENTER YOUR MESSAGE...'; [/newclass]
[newclass=.hlplSend span] color:#fafafa; width:25px; height:25px; background-color:rgba(255,255,255,.33); display:flex; align-items:center; justify-content:center; border-radius:100%; font-size:12px; transition:.1s ease; [/newclass]
[newclass=.hlplSend span:hover] font-size:15px; cursor:pointer; transition:.1s ease; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-track] background-color:#eee;border:0px;[/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-thumb] background-image: linear-gradient(to bottom, var(--planetAccent1), var(--planetAccent2) );border-radius:7px;border:0px; [/newclass]
[newclass=.hlplCredit] font:800 7px roboto; margin-left:350px; [/newclass]
[newclass=.hlplCredit a] font:800 7px roboto; [/newclass]
[newclass=.hlplhoneybee]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-paper-clip-o:before]font-family: "honeybee";content:"\e269";[/newclass]
[newclass=.th-up-direction:before]font-family: "honeybee";content:"\e48e";[/newclass]
[attr="class","abc-selk-link"]
[attr="class","lnr lnr-link"]
[attr="class","lnr lnr-link"]
[newclass=.selk-hello-planet .abc-selk-contain h1, .selk-hello-planet .abc-selk-hash a, .selk-hello-planet .abc-selk-rules h2]color:#21B7EC!important;[/newclass]
[newclass=.selk-hello-planet .abc-selk-link]background-color:#21B7EC!important;[/newclass]
[newclass=.abc-selk-contain, .selk-code] --abc-selk-accent:#CCCCCC; [/newclass]
[newclass=.abc-selk-contain] width:500px; padding:25px; -webkit-border-top-left-radius: 5px;-webkit-border-top-right-radius: 5px;border-top-left-radius: 5px;border-top-right-radius: 5px; background-color:#eee; display:flex; flex-flow:row wrap; justify-content:space-between; position:relative; overflow:hidden; [/newclass]
[newclass=.abc-selk-contain h1] margin:0px; width:100%; display:flex; flex-flow:row wrap; align-items:center; font:200 32px/32px Raleway; color:var(--abc-selk-accent); [/newclass]
[newclass=.abc-selk-contain h1:after] content:''; width:10px; height:1px; background-color:#ccc; flex-grow:2; margin-left:25px; [/newclass]
[newclass=.abc-selk-contain h1:before] content:'A-B-'; color:#ccc; [/newclass]
[newclass=.abc-selk-body] width:350px; border-radius:5px; color:#aaa; font:400 11px roboto; text-align:justify; margin-top:25px; [/newclass]
[newclass=.abc-selk-text] background-color:#fafafa; padding:25px; border-radius:5px; [/newclass]
[newclass=.abc-selk-hash] margin:25px 0px; text-align:left; [/newclass]
[newclass=.abc-selk-hash a] display:inline-block; height:10px; padding:5px 7px; margin:0px 3px 5px 0px; color:var(--abc-selk-accent); background-color:#ddd; border-radius:2px; text-transform:uppercase; font:600 10px/10px roboto; [/newclass]
[newclass=.abc-selk-colorpickers] width:309px; display:flex; flex-flow:row wrap; align-items:flex-start; [/newclass]
[newclass=.abc-selk-color] display:flex; flex-flow:row nowrap; width:309px; [/newclass]
[newclass=.abc-selk-color div] height:10px; display:inline-block; margin-right:5px; background-color:#ccc; [/newclass]
[newclass=.abc-selk-color span] height:10px; width:0px; display:flex; font:600 9px/10px Roboto; color:#ccc; [/newclass]
[newclass=.abc-selk-var] width:340px; font:400 10px/13px roboto; margin-top:25px; padding-right:10px; height:25px; overflow:auto; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar] width:5px; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-thumb] background-color:#999; border:0px; [/newclass]
[newclass=.abc-selk-var::-webkit-scrollbar-track] background-color:#ddd; border:0px; [/newclass]
[newclass=.abc-selk-rules] margin:25px 0px 0px 0px; text-align:left; width:125px; display:flex; justify-content:flex-start; align-self:stretch; flex-flow:column nowrap; border-right:1px solid #ddd; [/newclass]
[newclass=.abc-selk-rules img] width:100px; height:100px; border-radius:5px; [/newclass]
[newclass=.selk-code] background-color:#eee; width:500px; padding:25px; -webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; margin-top:-25px; position:relative; overflow:hidden; [/newclass]
[newclass=.selk-code div] margin:0px!important; display:flex; flex-flow:row wrap; align-items:center; justify-content:center; [/newclass]
[newclass=.selk-code div span] display:inline-block; font:700 9px roboto; color:#333; text-transform:uppercase; background-color:#ddd; margin:0px 5px 25px 0px; padding:5px 8px; border-radius:3px; [/newclass]
[newclass=.selk-code code] display:block; width:400px!important; height:100px!important;overflow:auto!important; padding:25px!important; text-align:justify; border-radius:5px; font:11px roboto; color:#aaa; background-color:#f7f7f7; border:0px!important; [/newclass]
[newclass=.selk-code .code_tag_toggle]margin-top:25px; border:0px!important; color:#333!important; font:700 9px/9px roboto!important; padding:5px 10px!important; border-radius:3px!important;[/newclass]
[newclass=.abc-selk-link] position:absolute; bottom:0px; right:0px; height:45px; width:45px!important; background-color:var(--abc-selk-accent); display:flex!important; align-items:center!important; justify-content:center!important; border-radius:0px; [/newclass]
[newclass=.abc-selk-link i] font-size:20px; color:#fafafa; [/newclass][break][break]
[nospaces][googlefont=Muli:900|Ubuntu:400]
[newclass=.hlplIM] --planetAccent1:#94DCD4; --planetAccent2:#21B7EC; [/newclass]
[attr="class","hlplIM"]
[attr="class","hlplMessages"]
to my lonely bed
good morning, good morning
to a coelacanth tail
good morning, good morning
to a sphinx tail
good morning, good morning
to you in my cache memory
good morning, good morning
[attr="class","hlplSend"][attr="class","th th-paper-clip-o"] [attr="class","th th-up-direction"]
[attr="class","hlplCredit"]SELKIE
[newclass=.hlplIM] width:400px; height:500px; overflow:hidden; border-radius:3px; [/newclass]
[newclass=.hlplBanner] height:10px; padding:5px 10px; background-color:#333; color:#fafafa; font:100 10px/21px ubuntu; display:flex; align-items:center; justify-content:space-between; [/newclass]
[newclass=.hlplContact] height:93px; padding:10px 10px; background-image: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); display:flex; flex-flow:row nowrap; align-items:center; justify-content:flex-start; overflow:hidden; [/newclass]
[newclass=.hlplContact img] width:75px; height:75px; border-radius:100%; padding:30px; background-color:rgba(255,255,255,.2); [/newclass]
[newclass=.hlplContact h1] font:900 25px/25px Muli; color:#fafafa; margin-left:-20px; text-align:left; text-transform:uppercase; [/newclass]
[newclass=.hlplContact h1 a] color:#fafafa!important; font:900 25px/25px Muli!important; text-shadow:2px 2px rgba(0,0,0,.075)!important;[/newclass]
[newclass=.hlplMessages] height:342px; width:400px; overflow:auto; text-align:left; background-color:#eee; display:flex; flex-flow:column nowrap; justify-content:flex-start; padding-top:10px; [/newclass]
[newclass=.hlplMessages h1, h2] margin:0px 10px 10px 10px; max-width:300px; color:#fafafa; padding:10px; font:12px roboto; border-radius:3px; width:auto; [/newclass]
[newclass=.hlplMessages h1 img, h2 img] border-radius:3px; display:block; max-width:300px; border:1px solid rgba(255,255,255,.5);[/newclass]
[newclass=.hlplMessages h1] background: linear-gradient(to bottom right, var(--planetAccent1), var(--planetAccent2) ); margin-left: auto; text-align:right; [/newclass]
[newclass=.hlplMessages h2] background: var(--planetAccent2); margin-right:auto; text-align:left; [/newclass]
[newclass=.hlplSend] background-image: linear-gradient(to right, var(--planetAccent1), var(--planetAccent2) ); height:35px; padding:0px 5px; display:flex; flex-flow:row wrap; align-items:center; justify-content:flex-start; [/newclass]
[newclass=.hlplSend div] width:318px; height:13px; margin:0px 5px; padding:5px; background-color:rgba(255,255,255,.25); font:400 10px/15px Ubuntu; color:#fafafa; cursor:text; [/newclass]
[newclass=.hlplSend div::before] content:'ENTER YOUR MESSAGE...'; [/newclass]
[newclass=.hlplSend span] color:#fafafa; width:25px; height:25px; background-color:rgba(255,255,255,.33); display:flex; align-items:center; justify-content:center; border-radius:100%; font-size:12px; transition:.1s ease; [/newclass]
[newclass=.hlplSend span:hover] font-size:15px; cursor:pointer; transition:.1s ease; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar] width:7px;border:0px; [/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-track] background-color:#eee;border:0px;[/newclass]
[newclass=.hlplMessages::-webkit-scrollbar-thumb] background-image: linear-gradient(to bottom, var(--planetAccent1), var(--planetAccent2) );border-radius:7px;border:0px; [/newclass]
[newclass=.hlplCredit] font:800 7px roboto; margin-left:350px; [/newclass]
[newclass=.hlplCredit a] font:800 7px roboto; [/newclass]
[newclass=.hlplhoneybee]speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale } @font-face { font-family: "honeybee";src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot");src:url("//dl.dropbox.com/s/0l8lnm6qy7vzwn7/honeybee.eot?#iefix") format("embedded-opentype"),url("//dl.dropbox.com/s/504hc3yd80hv4ux/honeybee.woff") format("woff"),url("//dl.dropbox.com/s/2f5jbp3v8tjk5hf/honeybee.ttf") format("truetype"),url("//dl.dropbox.com/s/nyfekn9fqo1wid2/honeybee.svg#honeybee") format("svg");font-weight: normal;font-style: normal;[/newclass]
[newclass=.th-paper-clip-o:before]font-family: "honeybee";content:"\e269";[/newclass]
[newclass=.th-up-direction:before]font-family: "honeybee";content:"\e48e";[/newclass]