posted Dec 1, 2018 18:51:58 GMT -6 in buy the stars
[nospaces][googlefont=Roboto:400,600,700|Raleway:200|Roboto+Condensed:400,700]
[googlefont=Montserrat:300,700|Montserrat+Alternates:700|Open+Sans:400,400i]
[newclass=.buythestars] --buytsAccent:#C3A4AE; [/newclass]
[newclass=.buytsHeader img]animation-play-state:running!important;[/newclass]
[newclass=.buythestars] width:500px; background-color:#eee; border-radius:5px; overflow:hidden; [/newclass]
[newclass=.buytsHeader] width:500px; height:150px; background-color:#aaa; background-color:var(--buytsAccent); position:relative; display:flex; align-items:center; justify-content:space-between; overflow:hidden; [/newclass]
[newclass=.buytsHeader img] width:75px; height:75px; position:relative; margin-left:25px; border-radius:100%; padding:5px; background-color:#fafafa; border:10px solid #333; animation: buytspulse 3s infinite; animation-play-state:paused; } @keyframes buytspulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); } 33% { -moz-box-shadow: 0 0 0 20px rgba(0,0,0, 0); box-shadow: 0 0 0 20px rgba(0,0,0, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0); box-shadow: 0 0 0 0 rgba(0,0,0, 0); }[/newclass]
[newclass=.buytsHeader div:last-child] width:50px; background-color:#333; height:100%; display:flex; flex-flow:column nowrap; align-items:center; justify-content:center; [/newclass]
[newclass=.buytsHeader div a] font-size:20px; color:#5a5a5a; margin:10px 0px; [/newclass]
[newclass=.buytsHeader h1] margin:0px 0px 0px 25px; display:block; position:relative; text-align:left; font:700 45px/40px montserrat; text-transform:uppercase; color:#fafafa; text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333; [/newclass]
[newclass=.buytsHeader:before] content:''; position:absolute; margin-top:-100px; left:0px; width:100%; height:500px; opacity:.15; background-image:url(https://image.ibb.co/btvYeK/transparent_flowers_4.png); background-size:cover; [/newclass]
[newclass=.buytsBody] padding:25px; display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.buytsTrackerBox] width:100%; margin-bottom:25px; [/newclass]
[newclass=.buytsTrackerBox:last-child] margin-bottom:0px; [/newclass]
[newclass=.buytsTrackerBox h1] margin:0px 0px 0px 25px; text-align:left; font:700 25px/25px montserrat alternates; color:#aaa; color:var(--buytsAccent); text-shadow: -1px -1px 0 #fafafa, 1px -1px 0 #fafafa, -1px 1px 0 #fafafa, 1px 1px 0 #fafafa; [/newclass]
[newclass=.buytsTrackerBox div] background-color:#f5f5f5; margin-top:-5px; text-align:left; padding:10px; border-radius:5px; [/newclass]
[newclass=.buytsTrackerBox h2] margin:0px; min-height:20px; display:flex; align-items:center; justify-content:flex-start; font:300 20px/20px montserrat; font-style:italic; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox h2 a]font:300 20px/20px montserrat; color:var(--buytsAccent);[/newclass]
[newclass=.buytsTrackerBox h2:before] content:''; min-width:25px; margin-right:10px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox h2:after] content:''; margin-left:10px; flex-grow:1; min-width:25px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox div div] margin:0px; padding:10px 20px; border-radius:0px; font:400 11px open sans; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox div div a] font:700 11px montserrat alternates; [/newclass]
[newclass=.buytsCredit] font:bold 7px roboto; margin-left:425px; [/newclass]
[newclass=.buytsCredit a] font:bold 7px roboto!important; [/newclass]
[newclass=.selk-buy-the-stars .abc-selk-contain h1, .selk-buy-the-stars .abc-selk-hash a, .selk-buy-the-stars .abc-selk-rules h2]color:#C3A4AE!important;[/newclass]
[newclass=.selk-buy-the-stars .abc-selk-link]background-color:#C3A4AE!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]
[attr="class","selk-buy-the-stars"]
[break][break][attr="class","abc-selk-contain"]
buy the stars
[attr="class","abc-selk-rules"]
[attr="class","abc-selk-body"]
[attr="class","abc-selk-text"]
the tracker template of the ABC set! picking just one marina song to use for this challenge was the hardest thing i've ever done, tbh. [break][break]
like the last template, this uses variables, so you only have to replace the one hex code at the top. if you'd like to disable the icon animation, delete the entire .buytsHeader img newclass also conveniently located at the top.
the tracker template of the ABC set! picking just one marina song to use for this challenge was the hardest thing i've ever done, tbh. [break][break]
like the last template, this uses variables, so you only have to replace the one hex code at the top. if you'd like to disable the icon animation, delete the entire .buytsHeader img newclass also conveniently located at the top.
[attr="class","abc-selk-hash"]
[HASH]lighttracking [HASH]icon [HASH]animation [HASH]noscroll [HASH]pattern [HASH]montserratalternates [HASH]montserrat [HASH]opensans [HASH]abcsofcode
[HASH]lighttracking [HASH]icon [HASH]animation [HASH]noscroll [HASH]pattern [HASH]montserratalternates [HASH]montserrat [HASH]opensans [HASH]abcsofcode
[attr="class","abc-selk-colorpickers"]
[attr="class","abc-selk-color"]
#C3A4AE
#C3A4AE
[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(--buytsAccent) to the desired hex code.
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(--buytsAccent) to the desired hex code.
[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=Montserrat:300,700|Montserrat+Alternates:700|Open+Sans:400,400i]
[newclass=.buythestars] --buytsAccent:#C3A4AE; [/newclass]
[newclass=.buytsHeader img]animation-play-state:running!important;[/newclass]
[div align="center"][div][attr="class","buythestars"]
[div][attr="class","buytsHeader"]
[a title="APPLICATION" href=""][img src="https://image.ibb.co/cHPEj9/21.png" style="width:75px;height:75px;"][/a]
[h1]firstname lastname[/h1]
[/div]
[div][attr="class","buytsBody"]
[div][attr="class","buytsTrackerBox"]
[h1]ongoing[/h1]
[div]
[h2][a href="/"]
buy the stars
[/a][/h2]
[div]
with @admin. all my life i've been so lonely, all in the name of being holy.
[/div]
[h2][a href="/"]
living dead
[/a][/h2]
[div]
i haven't lived life, i haven't lived love, just a bird's eye view, from the sky above.
[/div]
[/div][/div]
[div][attr="class","buytsTrackerBox"]
[h1]complete[/h1]
[div]
[h2][a href="/"]
radioactive
[/a][/h2]
[div]
my heart is nuclear, love is all that i fear. ready to be let down, now i’m heading for a meltdown.
[/div]
[h2][a href="/"]
fear and loathing
[/a][/h2]
[div]
and now i see it for the first time, there is no crime in being kind.
[/div]
[h2][a href="/"]
obsessions
[/a][/h2]
[div]
you never told me what it was that made you strong, and what it was that made you weak.
[/div]
[h2][a href="/"]
the family jewels
[/a][/h2]
[div]
welcome to the family jewels, coal to diamonds, sold to fools. welcome to the family jewels, simmer and suffer, can't keep his cool.
[/div]
[/div][/div]
[div][attr="class","buytsTrackerBox"]
[h1]planned[/h1]
[div]
[h2][a href="/"]
how to be a heartbreaker
[/a][/h2]
[div]
rule number one, is that you gotta have fun. but baby when you're done, you gotta be the first to run.
[/div]
[h2][a href="/"]
hermit the frog
[/a][/h2]
[div]
i was the wrong damn girl in the wrong damn room, i broke my glass balloon.
[/div]
[h2][a href="/"]
i am not a robot
[/a][/h2]
[div]
you don't always have to be on top. better to be hated than loved, loved, loved for what you're not.
[/div]
[h2][a href="/"]
the state of dreaming
[/a][/h2]
[div]
i live my life inside a dream, only waking when i sleep. i would sell my sorry soul, if i could have it all.
[/div]
[/div][/div]
[/div][/div]
[div][attr="class","buytsCredit"][a href="http://pixel-perfect.boards.net/user/15"]SELKIE[/a][/div]
[/div]
[newclass=.buythestars] width:500px; background-color:#eee; border-radius:5px; overflow:hidden; [/newclass]
[newclass=.buytsHeader] width:500px; height:150px; background-color:#aaa; background-color:var(--buytsAccent); position:relative; display:flex; align-items:center; justify-content:space-between; overflow:hidden; [/newclass]
[newclass=.buytsHeader img] width:75px; height:75px; position:relative; margin-left:25px; border-radius:100%; padding:5px; background-color:#fafafa; border:10px solid #333; animation: buytspulse 3s infinite; animation-play-state:paused; } @keyframes buytspulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); } 33% { -moz-box-shadow: 0 0 0 20px rgba(0,0,0, 0); box-shadow: 0 0 0 20px rgba(0,0,0, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0); box-shadow: 0 0 0 0 rgba(0,0,0, 0); }[/newclass]
[newclass=.buytsHeader div:last-child] width:50px; background-color:#333; height:100%; display:flex; flex-flow:column nowrap; align-items:center; justify-content:center; [/newclass]
[newclass=.buytsHeader div a] font-size:20px; color:#5a5a5a; margin:10px 0px; [/newclass]
[newclass=.buytsHeader h1] margin:0px 0px 0px 25px; display:block; position:relative; text-align:left; font:700 45px/40px montserrat; text-transform:uppercase; color:#fafafa; text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333; [/newclass]
[newclass=.buytsHeader:before] content:''; position:absolute; margin-top:-100px; left:0px; width:100%; height:500px; opacity:.15; background-image:url(https://image.ibb.co/btvYeK/transparent_flowers_4.png); background-size:cover; [/newclass]
[newclass=.buytsBody] padding:25px; display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.buytsTrackerBox] width:100%; margin-bottom:25px; [/newclass]
[newclass=.buytsTrackerBox:last-child] margin-bottom:0px; [/newclass]
[newclass=.buytsTrackerBox h1] margin:0px 0px 0px 25px; text-align:left; font:700 25px/25px montserrat alternates; color:#aaa; color:var(--buytsAccent); text-shadow: -1px -1px 0 #fafafa, 1px -1px 0 #fafafa, -1px 1px 0 #fafafa, 1px 1px 0 #fafafa; [/newclass]
[newclass=.buytsTrackerBox div] background-color:#f5f5f5; margin-top:-5px; text-align:left; padding:10px; border-radius:5px; [/newclass]
[newclass=.buytsTrackerBox h2] margin:0px; min-height:20px; display:flex; align-items:center; justify-content:flex-start; font:300 20px/20px montserrat; font-style:italic; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox h2 a]font:300 20px/20px montserrat; color:var(--buytsAccent);[/newclass]
[newclass=.buytsTrackerBox h2:before] content:''; min-width:25px; margin-right:10px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox h2:after] content:''; margin-left:10px; flex-grow:1; min-width:25px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox div div] margin:0px; padding:10px 20px; border-radius:0px; font:400 11px open sans; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox div div a] font:700 11px montserrat alternates; [/newclass]
[newclass=.buytsCredit] font:bold 7px roboto; margin-left:425px; [/newclass]
[newclass=.buytsCredit a] font:bold 7px roboto!important; [/newclass][attr="class","abc-selk-link"]
[attr="class","lnr lnr-link"]
[attr="class","lnr lnr-link"]
[googlefont=Montserrat:300,700|Montserrat+Alternates:700|Open+Sans:400,400i]
[newclass=.buythestars] --buytsAccent:#C3A4AE; [/newclass]
[newclass=.buytsHeader img]animation-play-state:running!important;[/newclass]
[attr="class","buythestars"]
[attr="class","buytsHeader"]
firstname lastname
[attr="class","buytsBody"]
[attr="class","buytsTrackerBox"]
i haven't lived life, i haven't lived love, just a bird's eye view, from the sky above.
ongoing
buy the stars
living dead
i haven't lived life, i haven't lived love, just a bird's eye view, from the sky above.
[attr="class","buytsTrackerBox"]
my heart is nuclear, love is all that i fear. ready to be let down, now i’m heading for a meltdown.
and now i see it for the first time, there is no crime in being kind.
you never told me what it was that made you strong, and what it was that made you weak.
welcome to the family jewels, coal to diamonds, sold to fools. welcome to the family jewels, simmer and suffer, can't keep his cool.
complete
radioactive
my heart is nuclear, love is all that i fear. ready to be let down, now i’m heading for a meltdown.
fear and loathing
and now i see it for the first time, there is no crime in being kind.
obsessions
you never told me what it was that made you strong, and what it was that made you weak.
the family jewels
welcome to the family jewels, coal to diamonds, sold to fools. welcome to the family jewels, simmer and suffer, can't keep his cool.
[attr="class","buytsTrackerBox"]
rule number one, is that you gotta have fun. but baby when you're done, you gotta be the first to run.
i was the wrong damn girl in the wrong damn room, i broke my glass balloon.
you don't always have to be on top. better to be hated than loved, loved, loved for what you're not.
i live my life inside a dream, only waking when i sleep. i would sell my sorry soul, if i could have it all.
planned
how to be a heartbreaker
rule number one, is that you gotta have fun. but baby when you're done, you gotta be the first to run.
hermit the frog
i was the wrong damn girl in the wrong damn room, i broke my glass balloon.
i am not a robot
you don't always have to be on top. better to be hated than loved, loved, loved for what you're not.
the state of dreaming
i live my life inside a dream, only waking when i sleep. i would sell my sorry soul, if i could have it all.
[attr="class","buytsCredit"]SELKIE
[newclass=.buythestars] width:500px; background-color:#eee; border-radius:5px; overflow:hidden; [/newclass]
[newclass=.buytsHeader] width:500px; height:150px; background-color:#aaa; background-color:var(--buytsAccent); position:relative; display:flex; align-items:center; justify-content:space-between; overflow:hidden; [/newclass]
[newclass=.buytsHeader img] width:75px; height:75px; position:relative; margin-left:25px; border-radius:100%; padding:5px; background-color:#fafafa; border:10px solid #333; animation: buytspulse 3s infinite; animation-play-state:paused; } @keyframes buytspulse { 0% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); box-shadow: 0 0 0 0 rgba(0,0,0, 0.25); } 33% { -moz-box-shadow: 0 0 0 20px rgba(0,0,0, 0); box-shadow: 0 0 0 20px rgba(0,0,0, 0); } 100% { -moz-box-shadow: 0 0 0 0 rgba(0,0,0, 0); box-shadow: 0 0 0 0 rgba(0,0,0, 0); }[/newclass]
[newclass=.buytsHeader div:last-child] width:50px; background-color:#333; height:100%; display:flex; flex-flow:column nowrap; align-items:center; justify-content:center; [/newclass]
[newclass=.buytsHeader div a] font-size:20px; color:#5a5a5a; margin:10px 0px; [/newclass]
[newclass=.buytsHeader h1] margin:0px 0px 0px 25px; display:block; position:relative; text-align:left; font:700 45px/40px montserrat; text-transform:uppercase; color:#fafafa; text-shadow: -1px -1px 0 #333, 1px -1px 0 #333, -1px 1px 0 #333, 1px 1px 0 #333; [/newclass]
[newclass=.buytsHeader:before] content:''; position:absolute; margin-top:-100px; left:0px; width:100%; height:500px; opacity:.15; background-image:url(https://image.ibb.co/btvYeK/transparent_flowers_4.png); background-size:cover; [/newclass]
[newclass=.buytsBody] padding:25px; display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; [/newclass]
[newclass=.buytsTrackerBox] width:100%; margin-bottom:25px; [/newclass]
[newclass=.buytsTrackerBox:last-child] margin-bottom:0px; [/newclass]
[newclass=.buytsTrackerBox h1] margin:0px 0px 0px 25px; text-align:left; font:700 25px/25px montserrat alternates; color:#aaa; color:var(--buytsAccent); text-shadow: -1px -1px 0 #fafafa, 1px -1px 0 #fafafa, -1px 1px 0 #fafafa, 1px 1px 0 #fafafa; [/newclass]
[newclass=.buytsTrackerBox div] background-color:#f5f5f5; margin-top:-5px; text-align:left; padding:10px; border-radius:5px; [/newclass]
[newclass=.buytsTrackerBox h2] margin:0px; min-height:20px; display:flex; align-items:center; justify-content:flex-start; font:300 20px/20px montserrat; font-style:italic; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox h2 a]font:300 20px/20px montserrat; color:var(--buytsAccent);[/newclass]
[newclass=.buytsTrackerBox h2:before] content:''; min-width:25px; margin-right:10px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox h2:after] content:''; margin-left:10px; flex-grow:1; min-width:25px; height:1px; background-color:#eaeaea; [/newclass]
[newclass=.buytsTrackerBox div div] margin:0px; padding:10px 20px; border-radius:0px; font:400 11px open sans; color:#aaa; [/newclass]
[newclass=.buytsTrackerBox div div a] font:700 11px montserrat alternates; [/newclass]
[newclass=.buytsCredit] font:bold 7px roboto; margin-left:425px; [/newclass]
[newclass=.buytsCredit a] font:bold 7px roboto!important; [/newclass]
[newclass=.selk-buy-the-stars .abc-selk-contain h1, .selk-buy-the-stars .abc-selk-hash a, .selk-buy-the-stars .abc-selk-rules h2]color:#C3A4AE!important;[/newclass]
[newclass=.selk-buy-the-stars .abc-selk-link]background-color:#C3A4AE!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]